1

unimall-admin/config/dep.env.js

@@ -3,4 +3,6 @@ module.exports = {
     ENV_CONFIG: '"dep"',
     HOST: '"http://192.168.110.82:8080"',
     BASE_API: '"http://192.168.110.82:8080/m.api"'
+        // HOST: '"http://192.168.149.35:8080"',
+        // BASE_API: '"http://192.168.149.35:8080/m.api"'
 }

unimall-admin/config/dev.env.js

@@ -4,8 +4,8 @@ module.exports = {
 
     HOST: '"http://192.168.110.82:8080"',
     BASE_API: '"http://192.168.110.82:8080/m.api"'
-        // HOST: '"http://192.168.1.115:8080"',
-        // BASE_API: '"http://192.168.1.115:8080/m.api"'
+        // HOST: '"http://192.168.149.35:8080"',
+        // BASE_API: '"http://192.168.149.35:8080/m.api"'
         // HOST: '"http://192.168.1.113:8080"',
 
     // BASE_API: '"http://192.168.1.113:8080/m.api"'

unimall-admin/config/index.js

@@ -15,7 +15,7 @@ module.exports = {
 
         // can be overwritten by process.env.HOST
         // if you want dev by ip, please set host: '0.0.0.0'
-        host: '192.168.110.175',
+        host: 'localhost',
         port: 9528, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
         autoOpenBrowser: true,
         errorOverlay: true,

unimall-admin/src/api/MaritimeAdministration.js

@@ -4,12 +4,12 @@ import Qs from 'qs'
 export function listMaritimeAdministration(query) {
   return request({
     method: 'post',
-    params:{
+    params: {
       _gp: 'admin.maritimeadministration',
       _mt: 'list',
       page: query.page,
       limit: query.limit,
-      ...query
+      MaritimeAdministrationDTO: JSON.stringify(query.type)
     }
   })
 }
@@ -46,3 +46,26 @@ export function deleteMaritimeAdministration(id) {
     }
   })
 }
+
+export function exportXlsx(data) {
+  return request({
+    method: 'post',
+    data: Qs.stringify({
+      _gp: 'admin.maritimeadministration',
+      _mt: 'export',
+      MaritimeAdministrationDTO: JSON.stringify(data),
+      response: 'blob'
+    })
+  })
+}
+
+export function importWord(data) {
+  return request({
+    method: 'post',
+    data: Qs.stringify({
+      _gp: 'admin.foreignexchange',
+      _mt: 'createAll',
+      ForeignExchangeDTO: JSON.stringify(data)
+    })
+  })
+}

unimall-admin/src/api/MaritimeDetail.js

@@ -4,9 +4,9 @@ import Qs from 'qs'
 export function listMaritimeDetail(query) {
   return request({
     method: 'post',
-    params:{
-      _gp: 'admin.maritimedetail',
-      _mt: 'list',
+    params: {
+      _gp: 'admin.maritimeadministration',
+      _mt: 'getInfo',
       page: query.page,
       limit: query.limit,
       ...query

unimall-admin/src/api/foreignExchange.js

@@ -46,3 +46,26 @@ export function deleteForeignExchange(id) {
     }
   })
 }
+
+export function exportXlsx(data) {
+  return request({
+    method: 'post',
+    data: Qs.stringify({
+      _gp: 'admin.foreignexchange',
+      _mt: 'export',
+      ForeignExchangeDTO: JSON.stringify(data),
+      response: 'blob'
+    })
+  })
+}
+
+export function importWord(data) {
+  return request({
+    method: 'post',
+    data: Qs.stringify({
+      _gp: 'admin.foreignexchange',
+      _mt: 'createAll',
+      ForeignExchangeDTO: JSON.stringify(data)
+    })
+  })
+}

unimall-admin/src/api/productSales.js

@@ -4,12 +4,12 @@ import Qs from 'qs'
 export function listProductSales(query) {
   return request({
     method: 'post',
-    params:{
+    params: {
       _gp: 'admin.productsales',
       _mt: 'list',
       page: query.page,
       limit: query.limit,
-      ...query
+      ProductSalesDTO: JSON.stringify(query.type)
     }
   })
 }
@@ -46,3 +46,26 @@ export function deleteProductSales(id) {
     }
   })
 }
+
+export function exportXlsx(data) {
+  return request({
+    method: 'post',
+    data: Qs.stringify({
+      _gp: 'admin.productsales',
+      _mt: 'export',
+      ProductSalesDTO: JSON.stringify(data),
+      response: 'blob'
+    })
+  })
+}
+
+export function importWord(data) {
+  return request({
+    method: 'post',
+    data: Qs.stringify({
+      _gp: 'admin.productsales',
+      _mt: 'createAll',
+      ProductSalesDTO: JSON.stringify(data)
+    })
+  })
+}

unimall-admin/src/router/route.json

@@ -83,6 +83,32 @@
                 },
                 "name": "maritimeAdministration",
                 "page": "/maritimeAdministration/MaritimeAdministration"
+            },
+            {
+                "path": "MaritimeAdministrationadd",
+                "meta": {
+                    "noCache": true,
+                    "perms": [
+                        ""
+                    ],
+                    "title": "海运业务添加"
+                },
+                "name": "MaritimeAdministrationadd",
+                "page": "/maritimeAdministration/MaritimeAdministrationadd",
+                "hidden": true
+            },
+            {
+                "path": "MaritimeAdministrationedit",
+                "meta": {
+                    "noCache": true,
+                    "perms": [
+                        ""
+                    ],
+                    "title": "海运业务编辑"
+                },
+                "name": "MaritimeAdministrationedit",
+                "page": "/maritimeAdministration/MaritimeAdministrationedit",
+                "hidden": true
             }
 
 

unimall-admin/src/views/expressBill/expressBill.vue

@@ -206,6 +206,7 @@ export default {
   components: { Pagination },
   data() {
     return {
+      currentPage: 1,
       excelFreightspace: [],
       modification: [],
       kdList1: [],

unimall-admin/src/views/foreignExchange/foreignExchange.vue

@@ -10,6 +10,28 @@
         style="width: 200px;"
         placeholder="请输入客户编号"
       />
+      <el-button
+        class="filter-item"
+        type="primary"
+        size="mini"
+        icon="el-icon-edit"
+        @click="exportlist"
+      >导出</el-button>
+
+      <el-upload
+        :on-change="importClick"
+        :show-file-list="false"
+        :auto-upload="false"
+        style="margin-left: 8px;margin-bottom:0"
+        class="filter-item"
+        action=""
+        accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
+        <el-button
+          class="filter-item"
+          type="primary"
+          size="mini"
+          icon="el-icon-edit">导入</el-button>
+      </el-upload>
       <el-button
         v-permission="['foreignExchange:foreignexchange:list']"
         class="filter-item"
@@ -32,12 +54,22 @@
     <el-table
       v-loading="listLoading"
       :data="list"
+      :summary-method="getSummaries"
       size="small"
       element-loading-text="正在查询中。。。"
       border
       fit
       highlight-current-row
+      show-summary
+      @selection-change="handleSelectionChange"
     >
+      <el-table-column :selectable="selectInit" type="selection" />
+      <el-table-column type="index" label="序号">
+        <template scope="scope">
+          <span v-if="scope.$index < 9">0{{ scope.$index + 1 }}</span>
+          <span v-else>{{ scope.$index + 1 }}</span>
+        </template>
+      </el-table-column>
       <el-table-column align="center" label="客户编号" prop="customerNo"/>
       <el-table-column align="center" label="收款日期" prop="collectionDate">
         <template slot-scope="scope">
@@ -64,14 +96,14 @@
         </template>
       </el-table-column>
     </el-table>
-
-    <pagination
-      v-show="total>0"
+    <el-pagination
+      :current-page="currentPage"
+      :page-sizes="[100, 200, 300, 400,1000,1500,2000]"
+      :page-size="100"
       :total="total"
-      :page.sync="listQuery.page"
-      :limit.sync="listQuery.limit"
-      @pagination="getList"
-    />
+      layout="total, sizes, prev, pager, next, jumper"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"/>
 
     <!-- 添加或修改对话框 -->
     <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
@@ -131,7 +163,9 @@ import {
   listForeignExchange,
   createForeignExchange,
   updateForeignExchange,
-  deleteForeignExchange
+  deleteForeignExchange,
+  exportXlsx,
+  importWord
 } from '@/api/foreignExchange'
 import Pagination from '@/components/Pagination'
 import {
@@ -143,6 +177,9 @@ export default {
   components: { Pagination },
   data() {
     return {
+      currentPage: 1,
+      excelFreightspace: [],
+      modification: [],
       date: {
         year: dayjs().format('YYYY'),
         month: dayjs().format('MM')
@@ -172,8 +209,178 @@ export default {
   },
   created() {
     this.getList()
+    this.currentPage = 1
   },
   methods: {
+    selectInit(row) {
+      return true
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`)
+      this.listQuery.limit = val
+      this.getList()
+    },
+    handleCurrentChange(val) {
+      this.listQuery.page = val
+      console.log(`当前页: ${val}`)
+      this.getList()
+    },
+    getSummaries(param) {
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '合计'
+          return
+        } else if (index == 6||index == 5) {
+          const values = data.map((item) => Number(item[column.property]))
+          if (!values.every((value) => isNaN(value))) {
+            sums[index] = values.reduce((prev, curr) => {
+              const value = Number(curr)
+              if (!isNaN(value)) {
+                return prev + curr
+              } else {
+                return prev
+              }
+            }, 0)
+            sums[index] += ''
+          } else {
+            sums[index] = '--'
+          }
+        } else {
+          // sums[index] = "--";
+        }
+      })
+
+      return sums
+    },
+    importClick(file, fileList) {
+      this.fileTemp = file.raw
+      const fileName = file.raw.name
+      const fileType = fileName.substring(fileName.lastIndexOf('.') + 1)
+      // 判断上传文件格式
+      if (this.fileTemp) {
+        if (fileType == 'xlsx' || fileType == 'xls') {
+          this.importf(this.fileTemp)
+        } else {
+          this.$message({
+            type: 'warning',
+            message: '附件格式错误，请删除后重新上传！'
+          })
+        }
+      } else {
+        this.$message({
+          type: 'warning',
+          message: '请上传附件！'
+        })
+      }
+    },
+    importf(obj) {
+      this.excelFreightspace = []
+      // this.dialogVisible = true;
+      const _this = this
+      const inputDOM = this.$refs.inputer // 通过DOM取文件数据
+      this.file = event.currentTarget.files[0]
+      var rABS = false // 是否将文件读取为二进制字符串
+      var f = this.file
+      var reader = new FileReader()
+      // if (!FileReader.prototype.readAsBinaryString) {
+      FileReader.prototype.readAsBinaryString = function(f) {
+        var binary = ''
+        var rABS = false // 是否将文件读取为二进制字符串
+        var pt = this
+        var wb // 读取完成的数据
+        var outdata
+        var reader = new FileReader()
+        reader.onload = function(e) {
+          var bytes = new Uint8Array(reader.result)
+          var length = bytes.byteLength
+          for (var i = 0; i < length; i++) {
+            binary += String.fromCharCode(bytes[i])
+          }
+          var XLSX = require('xlsx')
+          if (rABS) {
+            wb = XLSX.read(btoa(fixdata(binary)), {
+              // 手动转化
+              type: 'base64',
+              cellDates: true
+            })
+          } else {
+            wb = XLSX.read(binary, {
+              type: 'binary'
+            })
+          }
+          // outdata就是你想要的东西 excel导入的数据
+          outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]])
+          // excel 数据再处理
+          const arr = []
+          outdata.map(v => {
+            // let jsonString = JSON.stringify(v).replace(/\*/g, '').replace(/\s/ig,'');
+            const jsonString = JSON.stringify(v)
+              .replace(/\//g, '')
+              .replace(/\s/gi, '')
+            v = JSON.parse(jsonString)
+            const obj = {}
+            // xxx代表列名
+            debugger
+            obj.customerNo = v.客户编号
+            obj.collectionDate = v.收款日期
+            obj.exchange = v.汇率
+            obj.rmb = v.人民币
+            obj.euro = v.欧元
+            obj.remarks = v.备注
+            _this.excelFreightspace.push(obj)
+          })
+          if (_this.excelFreightspace) {
+            importWord(_this.excelFreightspace).then(response => {
+              if (response.status == '200') {
+                _this.$notify({
+                  title: '成功',
+                  message: '导入成功',
+                  type: 'success'
+                })
+                _this.getList()
+              }
+            })
+          }
+        }
+        reader.readAsArrayBuffer(f)
+      }
+      if (rABS) {
+        reader.readAsArrayBuffer(f)
+      } else {
+        reader.readAsBinaryString(f)
+      }
+    },
+    handleSelectionChange(val) {
+      this.modification = val
+    },
+    async exportlist() {
+      debugger
+      if (this.modification.length == 0) {
+        this.$message.warning('请选择要导出的条目！')
+      } else {
+        console.log('导出数据', this.modification)
+        const _data = {
+          foreignExchangeDTOS: this.modification
+        }
+        const {
+          data
+        } = await exportXlsx(_data).then((response) => { debugger
+          this.download(response.data.data)
+          //   downloadFile({
+          //     res: data,
+          //     fileName: `${
+          //     this.date.year + (this.date.month ? `-${this.date.month}` : '')
+          //     }付款信息`,
+          //     type: 'xls',
+          //     })
+          if (response.status == '200') {
+
+          }
+        })
+      }
+    },
     getList() {
       this.listLoading = true
       listForeignExchange(this.listQuery)

unimall-admin/src/views/maritimeAdministration/MaritimeAdministration.vue

@@ -2,8 +2,23 @@
   <div class="app-container">
     <!-- 查询和其他操作 -->
     <div class="filter-container">
+      <el-input
+        v-model="listQuery.type.containerNo"
+        clearable
+        class="filter-item"
+        size="small"
+        style="width: 200px;"
+        placeholder="请输入集装箱柜号"
+      />
+      <el-input
+        v-model="listQuery.type.customerNo"
+        clearable
+        class="filter-item"
+        size="small"
+        style="width: 200px;"
+        placeholder="请输入客户编号"
+      />
       <el-button
-        v-permission="['maritimeAdministration:maritimeadministration:list']"
         class="filter-item"
         type="primary"
         size="mini"
@@ -11,33 +26,60 @@
         @click="handleFilter"
       >查找</el-button>
       <el-button
-        v-permission="['maritimeAdministration:maritimeadministration:create']"
         class="filter-item"
         type="primary"
         size="mini"
         icon="el-icon-edit"
         @click="handleCreate"
       >添加</el-button>
+      <el-button
+        class="filter-item"
+        type="primary"
+        size="mini"
+        icon="el-icon-edit"
+        @click="exportlist">导出</el-button>
+
+      <el-upload
+        :on-change="importClick"
+        :show-file-list="false"
+        :auto-upload="false"
+        style="margin-left: 8px;margin-bottom:0"
+        class="filter-item"
+        action=""
+        accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
+        <el-button
+          class="filter-item"
+          type="primary"
+          icon="el-icon-edit">导入</el-button>
+      </el-upload>
     </div>
 
     <!-- 查询结果 -->
     <el-table
       v-loading="listLoading"
       :data="list"
+      :span-method="objectSpanMethod"
       size="small"
       element-loading-text="正在查询中。。。"
       border
       fit
       highlight-current-row
-    >
+      @selection-change="handleSelectionChange">
+      <el-table-column :selectable="selectInit" type="selection"/>
+      <el-table-column align="center" label="快递公司" prop="courierServicesCompany" />
       <el-table-column align="center" label="集装箱柜号" prop="containerNo" />
       <el-table-column align="center" label="客户编号" prop="customerNo" />
+      <el-table-column align="center" label="已收到单号" prop="receivedNo" />
+      <el-table-column align="center" label="内件明细" prop="internalDetails" />
+      <el-table-column align="center" label="实重" prop="weight" />
+      <el-table-column align="center" label="长" prop="long1" />
+      <el-table-column align="center" label="宽" prop="wide" />
+      <el-table-column align="center" label="高" prop="height" />
+      <el-table-column align="center" label="体积重" prop="bulkWeight" />
       <el-table-column align="center" label="包裹数" prop="count" />
       <el-table-column align="center" label="人民币" prop="rmb" />
-      <el-table-column align="center" label="欧元 */" prop="euro" />
-      <el-table-column align="center" label="备注" prop="remark" />
-
-      <el-table-column align="center" label="操作" class-name="small-padding fixed-width">
+      <el-table-column align="center" label="欧元" prop="euro" />
+      <el-table-column align="center" label="操作" class-name="small-padding" width="200px">
         <template slot-scope="scope">
           <el-button
             v-permission="['maritimeAdministration:maritimeadministration:edit']"
@@ -55,13 +97,14 @@
       </el-table-column>
     </el-table>
 
-    <pagination
-      v-show="total>0"
+    <el-pagination
+      :current-page="currentPage"
+      :page-sizes="[100, 200, 300, 400,1000,1500,2000]"
+      :page-size="100"
       :total="total"
-      :page.sync="listQuery.page"
-      :limit.sync="listQuery.limit"
-      @pagination="getList"
-    />
+      layout="total, sizes, prev, pager, next, jumper"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"/>
 
     <!-- 添加或修改对话框 -->
     <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
@@ -70,30 +113,50 @@
         :rules="rules"
         :model="dataForm"
         status-icon
-        label-position="left"
+        label-position="right"
         label-width="100px"
-        style="width: 400px; margin-left:50px;"
       >
         <el-form-item label="id" prop="id" hidden>
           <el-input v-model="dataForm.id" />
         </el-form-item>
-        <el-form-item label="集装箱柜号" prop="deductionEuro">
-          <el-input v-model="dataForm.deductionEuro" />
+        <el-form-item label="集装箱柜号" prop="containerNo" class="item-style">
+          <el-input v-model="dataForm.containerNo" />
+        </el-form-item>
+        <el-form-item label="客户编号" prop="customerNo" class="item-style">
+          <el-input v-model="dataForm.customerNo" />
+        </el-form-item>
+        <el-form-item label="快递公司" prop="courierServicesCompany" class="item-style">
+          <el-input v-model="dataForm.courierServicesCompany" />
         </el-form-item>
-        <el-form-item label="客户编号" prop="deductionEuro">
-          <el-input v-model="dataForm.deductionEuro" />
+        <el-form-item label="已收到单号" prop="receivedNo" class="item-style">
+          <el-input v-model="dataForm.receivedNo" />
         </el-form-item>
-        <el-form-item label="包裹数" prop="deductionEuro">
-          <el-input v-model="dataForm.deductionEuro" />
+        <el-form-item label="内件明细" prop="internalDetails" class="item-style">
+          <el-input v-model="dataForm.internalDetails" />
         </el-form-item>
-        <el-form-item label="人民币" prop="deductionEuro">
-          <el-input v-model="dataForm.deductionEuro" />
+        <el-form-item label="实重" prop="weight" class="item-style">
+          <el-input v-model="dataForm.weight" />
         </el-form-item>
-        <el-form-item label="欧元" prop="deductionEuro">
-          <el-input v-model="dataForm.deductionEuro" />
+        <el-form-item label="长" prop="long1" class="item-style">
+          <el-input v-model="dataForm.long1" />
         </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input v-model="dataForm.deductionEuro" />
+        <el-form-item label="宽" prop="wide" class="item-style">
+          <el-input v-model="dataForm.wide" />
+        </el-form-item>
+        <el-form-item label="高" prop="height" class="item-style">
+          <el-input v-model="dataForm.height" />
+        </el-form-item>
+        <el-form-item label="体积重" prop="bulkWeight" class="item-style">
+          <el-input v-model="dataForm.bulkWeight" />
+        </el-form-item>
+        <el-form-item label="包裹数" prop="count" class="item-style">
+          <el-input v-model="dataForm.count" />
+        </el-form-item>
+        <el-form-item label="人民币" prop="rmb" class="item-style">
+          <el-input v-model="dataForm.rmb" />
+        </el-form-item>
+        <el-form-item label="欧元" prop="euro" class="item-style">
+          <el-input v-model="dataForm.euro" />
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -115,7 +178,9 @@ import {
   listMaritimeAdministration,
   createMaritimeAdministration,
   updateMaritimeAdministration,
-  deleteMaritimeAdministration
+  deleteMaritimeAdministration,
+  exportXlsx,
+  importWord
 } from '@/api/MaritimeAdministration'
 import Pagination from '@/components/Pagination'
 export default {
@@ -123,12 +188,19 @@ export default {
   components: { Pagination },
   data() {
     return {
+      modification: [],
+      currentPage: 1,
+      tableList: [],
       list: null,
       total: 0,
       listLoading: true,
       listQuery: {
         page: 1,
-        limit: 20
+        limit: 20,
+        type: {
+          containerNo: '',
+          customerNo: ''
+        }
       },
       dataForm: {
         id: undefined
@@ -145,13 +217,221 @@ export default {
   },
   created() {
     this.getList()
+    this.currentPage = 1
   },
   methods: {
+    selectInit(row) {
+      return true
+    },
+    async exportlist() { debugger
+      if (this.modification.length == 0) {
+        this.$message.warning('请选择要导出的条目！')
+      } else {
+        console.log('导出数据', this.modification)
+        const _data = {
+          maritimeDetailDTOS: this.modification
+        }
+        const {
+          data
+        } = await exportXlsx(_data).then((response) => {
+          this.download(response.data.data)
+          if (response.status == '200') {
+
+          }
+        })
+      }
+    },
+    importClick(file, fileList) {
+      this.fileTemp = file.raw
+      const fileName = file.raw.name
+      const fileType = fileName.substring(fileName.lastIndexOf('.') + 1)
+      // 判断上传文件格式
+      if (this.fileTemp) {
+        if (fileType == 'xlsx' || fileType == 'xls') {
+          this.importf(this.fileTemp)
+        } else {
+          this.$message({
+            type: 'warning',
+            message: '附件格式错误，请删除后重新上传！'
+          })
+        }
+      } else {
+        this.$message({
+          type: 'warning',
+          message: '请上传附件！'
+        })
+      }
+    },
+    importf(obj) {
+      this.countryList = []
+      this.excelFreightspace = []
+      // this.dialogVisible = true;
+      const _this = this
+      const inputDOM = this.$refs.inputer // 通过DOM取文件数据
+      this.file = event.currentTarget.files[0]
+      var rABS = false // 是否将文件读取为二进制字符串
+      var f = this.file
+      var reader = new FileReader()
+      // if (!FileReader.prototype.readAsBinaryString) {
+      FileReader.prototype.readAsBinaryString = function (f) {
+        var binary = ''
+        var rABS = false // 是否将文件读取为二进制字符串
+        var pt = this
+        var wb // 读取完成的数据
+        var outdata
+        var reader = new FileReader()
+        reader.onload = function (e) {
+          var bytes = new Uint8Array(reader.result)
+          var length = bytes.byteLength
+          for (var i = 0; i < length; i++) {
+            binary += String.fromCharCode(bytes[i])
+          }
+          var XLSX = require('xlsx')
+          if (rABS) {
+            wb = XLSX.read(btoa(fixdata(binary)), { // 手动转化
+              type: 'base64',
+              cellDates: true
+            })
+          } else {
+            wb = XLSX.read(binary, {
+              type: 'binary'
+            })
+          }
+          // outdata就是你想要的东西 excel导入的数据
+          outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]])
+          // excel 数据再处理
+          const arr = []
+          outdata.map(v => {
+            // let jsonString = JSON.stringify(v).replace(/\*/g, '').replace(/\s/ig,'');
+            const jsonString = JSON.stringify(v).replace(/\//g, '').replace(/\s/ig, '')
+            v = JSON.parse(jsonString)
+            const obj = {}
+            // xxx代表列名
+            obj.receiptPaymentDate = v.收款日期
+            obj.receivingWithdrawingRegion = v.收款地
+            obj.receivingWithdrawingPeople = v.付款人
+            obj.deductionEuro = v.金额EUR
+            obj.deductionRmb = v.金额RMB
+            obj.businessType = 1
+            obj.remarks = v.备注1
+            obj.remark = v.备注2
+            obj.updatePeople = _this.$store.getters.name
+            if (!obj.deductionEuro) {
+              obj.deductionEuro = 0
+            }
+            if (!obj.deductionRmb) {
+              obj.deductionRmb = 0
+            }
+            for (let i = 0; i < _this.placeList.length; i++) {
+              _this.countryList.push(_this.placeList[i].country)
+            }
+            if (!_this.countryList.includes(obj.receivingWithdrawingRegion)) {
+              _this.isAllowExport = false
+              _this.$notify({
+                title: '失败',
+                message: '导入失败，导入数据中收款地在系统中不存在，请重新编辑',
+                type: 'error'
+              })
+              return
+            } else {
+              _this.excelFreightspace.push(obj)
+              _this.isAllowExport = true
+            }
+            for (let i = 0; i < _this.khList.length; i++) {
+              _this.khList1.push(_this.khList[i].receivingWithdrawingPeople)
+            }
+            if (!_this.khList1.includes(obj.receivingWithdrawingPeople)) {
+              _this.isAllowExport = false
+              _this.$notify({
+                title: '失败',
+                message: '导入失败，导入数据中客户不存在，请重新编辑',
+                type: 'error'
+              })
+              return
+            } else {
+              _this.excelFreightspace.push(obj)
+              _this.isAllowExport = true
+            }
+          })
+          if (_this.excelFreightspace && _this.isAllowExport) {
+            importWord(_this.excelFreightspace).then((response) => {
+              if (response.status == '200') {
+                _this.$notify({
+                  title: '成功',
+                  message: '导入成功',
+                  type: 'success'
+                })
+                _this.getList()
+              }
+            })
+          }
+        }
+        reader.readAsArrayBuffer(f)
+      }
+      if (rABS) {
+        reader.readAsArrayBuffer(f)
+      } else {
+        reader.readAsBinaryString(f)
+      }
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`)
+      this.listQuery.limit = val
+      this.getList()
+    },
+    handleCurrentChange(val) {
+      this.listQuery.page = val
+      console.log(`当前页: ${val}`)
+      this.getList()
+    },
+    handleSelectionChange(val) {
+      this.modification = val
+    },
+    makeList(targetList) {
+      this.list = targetList
+      console.log(targetList)
+      const data = this.list
+      const arr = [] // 存放格式后的数据
+      const rowspan = [] // 存放数组每行的 合并row 数据
+      data.forEach(item => {
+        // debugger
+        for (let i = 0; i < item.maritimeDetailDOS.length; i++) {
+          const params = { ...item, ...item.maritimeDetailDOS[i] } // 合并数据item与item.data[i]的数据，构成新的行数据
+          params.rmb = item.maritimeDetailDOS.length // 获取合并的 行数（row -> 取item的子数组长度）
+          delete params.maritimeDetailDOS // 删除 rdata中的data属性; item属性中存在data，我们又获取了 item.data[i] 数据，所以此属性没用了删掉
+          console.log('delete params->', params) // 通过循环获取到所有数据列表
+          arr.push(params) // 存储格式好的数据
+          // 生成合并信息的数组 [3, 0, 0, 2, 0, 4, 0, 0, 0] 其中的0代表隐藏
+          if (i == 0) {
+            rowspan.push(item.maritimeDetailDOS.length)
+          } else {
+            rowspan.push(0)
+          }
+        }
+      })
+      this.list = arr // 处理好格式的 arr 进行赋值
+      console.log('tableData->', this.list)
+      console.log('rowspan->', rowspan)
+      this.rowspan = rowspan
+    },
+    // 单元格合并
+    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+      // 行，列，行下标，列下标( 控制要合并的列 )
+      if ([2, 3, 11, 12].includes(columnIndex)) {
+        const _row = this.rowspan[rowIndex]
+        const _col = _row > 0 ? 1 : 0 // 如果这一行隐藏了，这列也隐藏
+        return {
+          rowspan: _row, // 合并的行数
+          colspan: _col // 合并的列数，设为０则直接不显示
+        }
+      }
+    },
     getList() {
       this.listLoading = true
       listMaritimeAdministration(this.listQuery)
         .then(response => {
-          this.list = response.data.data.items
+          this.makeList(response.data.data.items)
+          // this.list = response.data.data.items
           this.total = response.data.data.total
           this.listLoading = false
         })
@@ -171,12 +451,15 @@ export default {
       }
     },
     handleCreate() {
-      this.resetForm()
-      this.dialogStatus = 'create'
-      this.dialogFormVisible = true
-      this.$nextTick(() => {
-        this.$refs['dataForm'].clearValidate()
+      this.$router.push({
+        path: 'MaritimeAdministrationadd'
       })
+      // this.resetForm()
+      // this.dialogStatus = 'create'
+      // this.dialogFormVisible = true
+      // this.$nextTick(() => {
+      //   this.$refs['dataForm'].clearValidate()
+      // })
     },
     createData() {
       this.$refs['dataForm'].validate(valid => {
@@ -203,12 +486,19 @@ export default {
       })
     },
     handleUpdate(row) {
-      this.dataForm = Object.assign({}, row)
-      this.dialogStatus = 'update'
-      this.dialogFormVisible = true
-      this.$nextTick(() => {
-        this.$refs['dataForm'].clearValidate()
+      debugger
+      this.$router.push({
+        path: 'MaritimeAdministrationedit',
+        query: {
+          id: row.infoId
+        }
       })
+      // this.dataForm = Object.assign({}, row)
+      // this.dialogStatus = 'update'
+      // this.dialogFormVisible = true
+      // this.$nextTick(() => {
+      //   this.$refs['dataForm'].clearValidate()
+      // })
     },
     updateData() {
       this.$refs['dataForm'].validate(valid => {
@@ -274,3 +564,13 @@ export default {
   }
 }
 </script>
+<style lang="scss" scoped>
+.item-style {
+  width: 48%;
+  display: inline-block;
+  // margin-left: 20px;
+}
+.el-form-item--medium .el-form-item__label {
+  text-align: right;
+}
+</style>

unimall-admin/src/views/maritimeAdministration/MaritimeAdministrationadd.vue

@@ -0,0 +1,297 @@
+<template>
+  <div class="app-container">
+    <el-row class="title-style">
+      <el-col :span="12">
+        <h2 class="bg-left title">海运业务</h2>
+      </el-col>
+      <el-col :span="12" class="bg-right">
+        <el-button class="bg-bottom" type="primary" size="small" @click="returnsales()">返回</el-button>
+        <el-button type="primary" size="small" @click="createData">提交</el-button>
+      </el-col>
+    </el-row>
+    <el-form
+      ref="dataForm"
+      :rules="rules"
+      :model="dataForm"
+      status-icon
+      label-position="left"
+      label-width="200px"
+      class="position"
+    >
+      <div class="small-title" style="font-size: 16px">基本信息</div>
+      <div class="ws-info-table">
+        <el-form-item label="id" prop="id" hidden>
+          <el-input v-model="dataForm.id" />
+        </el-form-item>
+        <el-form-item label="集装箱柜号:" prop="containerNo" style="margin-right:50px">
+          <el-input v-model="dataForm.containerNo" class="input-width" />
+        </el-form-item>
+        <el-form-item label="客户编号:" prop="customerNo" style="margin-right:50px">
+          <el-input v-model="dataForm.customerNo" class="input-width" />
+        </el-form-item>
+        <el-form-item label="包裹数:" prop="count" style="margin-right:50px">
+          <el-input v-model="dataForm.count" class="input-width" />
+        </el-form-item>
+        <el-form-item label="人民币:" prop="rmb" style="margin-right:50px">
+          <el-input v-model="dataForm.rmb" class="input-width" />
+        </el-form-item>
+        <el-form-item label="欧元:" prop="euro" style="margin-right:50px">
+          <el-input v-model="dataForm.euro" class="input-width" />
+        </el-form-item>
+        <el-form-item label="备注:" prop="remark" style="margin-right:50px">
+          <el-input v-model="dataForm.remark" class="input-width" />
+        </el-form-item>
+
+      </div>
+      <div class="small-title" style="font-size: 16px">详情</div>
+      <div style="display:flex">
+        <el-button
+          size="mini"
+          class="filter-item"
+          type="primary"
+          icon="el-icon-edit"
+          style="margin-bottom:20px"
+          @click="addDetail"
+        >添加</el-button>
+      </div>
+
+      <el-table
+        v-loading="listLoading"
+        :data="list"
+        size="small"
+        element-loading-text="正在查询中。。。"
+        border
+        fit
+        highlight-current-row
+      >
+        <el-table-column type="index" label="序号">
+          <template scope="scope">
+            <span v-if="scope.$index < 9">0{{ scope.$index + 1 }}</span>
+            <span v-else>{{ scope.$index + 1 }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="快递公司" prop="courierServicesCompany">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.courierServicesCompany"/>
+          </template>
+        </el-table-column>
+
+        <el-table-column align="center" label="已收到单号" prop="receivedNo">
+          <template slot-scope="scope">
+            <el-input
+              v-model="scope.row.receivedNo"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="内件明细" prop="internalDetails">
+          <template slot-scope="scope">
+            <el-input
+              v-model="scope.row.internalDetails"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="实重" prop="weight">
+          <template slot-scope="scope">
+            <el-input
+              v-model="scope.row.weight"
+              :disabled="isJz"/>
+          </template>
+        </el-table-column>
+
+        <el-table-column align="center" label="长" prop="long1">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.long1" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="宽" prop="wide">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.wide" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="高" prop="height">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.height" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="体积重" prop="bulkWeight">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.bulkWeight" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="备注" prop="remark">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.remark" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" class-name="small-padding fixed-width">
+          <template slot-scope="scope">
+            <el-button
+              type="danger"
+              size="mini"
+              @click.native.prevent="deleteRow(scope.$index, list)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import {
+  listMaritimeAdministration,
+  createMaritimeAdministration,
+  updateMaritimeAdministration,
+  deleteMaritimeAdministration
+} from '@/api/MaritimeAdministration'
+import Pagination from '@/components/Pagination'
+export default {
+  name: 'MaritimeAdministrationadd',
+  components: { Pagination },
+  data() {
+    return {
+      list: null,
+      total: 0,
+      listLoading: false,
+      listQuery: {
+        page: 1,
+        limit: 100
+      },
+      dataForm: {
+        id: undefined,
+        amountPaid: 0,
+        amountIng: 0
+
+      },
+      dialogFormVisible: false,
+      submiting: false,
+      dialogStatus: '',
+      textMap: {
+        update: '编辑',
+        create: '创建'
+      },
+      rules: {}
+    }
+  },
+  created() {
+    this.list = []
+  },
+  methods: {
+
+    returnsales() {
+      this.$router.push({
+        path: 'MaritimeAdministration'
+      })
+    },
+    handleSelectionChange(val) {
+      this.modification = val
+    },
+    addDetail() {
+      console.log('add')
+      this.list.push({
+        courierServicesCompany: '',
+        receivedNo: '',
+        internalDetails: '',
+        weight: '',
+        long1: '',
+        wide: '',
+        height: '',
+        bulkWeight: '',
+        remark: ''
+      })
+    },
+    createData() {
+      this.listLoading = true
+      this.$refs['dataForm'].validate(valid => {
+        if (valid) {
+          this.submiting = true
+          this.dataForm.maritimeDetailDTOS = this.list
+          createMaritimeAdministration(this.dataForm)
+            .then(response => {
+              //   this.list.unshift(response.data.data)
+              this.dialogFormVisible = false
+              this.$notify.success({
+                title: '成功',
+                message: '添加成功'
+              })
+              this.submiting = false
+              this.returnsales()
+            })
+            .catch(response => {
+              this.$notify.error({
+                title: '失败',
+                message: response.data.errmsg
+              })
+              this.submiting = false
+            })
+        }
+      })
+    },
+    deleteRow(index, rows) {
+      rows.splice(index, 1)
+    }
+  }
+}
+</script>
+<style lang="scss">
+.bg-left {
+  padding-left: 30px;
+}
+.bg-right {
+  padding-right: 10px;
+  text-align: right;
+}
+.bg-bottom {
+  margin: 15px 0px;
+}
+.title-style {
+  background: #f6f7fc;
+  border-radius: 5px;
+}
+.title::before {
+  content: "";
+  display: inline-block;
+  width: 5px;
+  height: 30px;
+  background: #5473e8;
+  position: absolute;
+  left: 0;
+}
+.position {
+  position: relative;
+}
+.small-title {
+  position: relative;
+  padding: 10px;
+  font-weight: 600;
+  margin: 20px 0;
+}
+.small-title::before {
+  position: absolute;
+  content: "";
+  display: block;
+  background: #5473e8;
+  width: 4px;
+  height: 14px;
+  left: 0px;
+  top: 13px;
+}
+.el-form {
+  padding: 0 40px;
+}
+.ws-info-table {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  border-left: 1px solid #ccc;
+  border-top: 1px solid #ccc;
+  position: relative;
+  border-left: 0;
+  border-top: 0;
+}
+.input-width {
+  width: 200px;
+}
+</style>

unimall-admin/src/views/maritimeAdministration/MaritimeAdministrationedit.vue

@@ -0,0 +1,312 @@
+<template>
+  <div class="app-container">
+    <el-row class="title-style">
+      <el-col :span="12">
+        <h2 class="bg-left title">海运业务</h2>
+      </el-col>
+      <el-col :span="12" class="bg-right">
+        <el-button class="bg-bottom" type="primary" size="small" @click="returnsales()">返回</el-button>
+        <el-button type="primary" size="small" @click="createData">提交</el-button>
+      </el-col>
+    </el-row>
+    <el-form
+      ref="dataForm"
+      :rules="rules"
+      :model="dataForm"
+      status-icon
+      label-position="left"
+      label-width="200px"
+      class="position"
+    >
+      <div class="small-title" style="font-size: 16px">基本信息</div>
+      <div class="ws-info-table">
+        <el-form-item label="id" prop="id" hidden>
+          <el-input v-model="dataForm.id" />
+        </el-form-item>
+        <el-form-item label="集装箱柜号:" prop="containerNo" style="margin-right:50px">
+          <el-input v-model="dataForm.containerNo" class="input-width" />
+        </el-form-item>
+        <el-form-item label="客户编号:" prop="customerNo" style="margin-right:50px">
+          <el-input v-model="dataForm.customerNo" class="input-width" />
+        </el-form-item>
+        <el-form-item label="包裹数:" prop="count" style="margin-right:50px">
+          <el-input v-model="dataForm.count" class="input-width" />
+        </el-form-item>
+        <el-form-item label="人民币:" prop="rmb" style="margin-right:50px">
+          <el-input v-model="dataForm.rmb" class="input-width" />
+        </el-form-item>
+        <el-form-item label="欧元:" prop="euro" style="margin-right:50px">
+          <el-input v-model="dataForm.euro" class="input-width" />
+        </el-form-item>
+        <el-form-item label="备注:" prop="remark" style="margin-right:50px">
+          <el-input v-model="dataForm.remark" class="input-width" />
+        </el-form-item>
+
+      </div>
+      <div class="small-title" style="font-size: 16px">详情</div>
+      <div style="display:flex">
+        <el-button
+          size="mini"
+          class="filter-item"
+          type="primary"
+          icon="el-icon-edit"
+          style="margin-bottom:20px"
+          @click="addDetail"
+        >添加</el-button>
+      </div>
+
+      <el-table
+        v-loading="listLoading"
+        :data="list"
+        size="small"
+        element-loading-text="正在查询中。。。"
+        border
+        fit
+        highlight-current-row
+      >
+        <el-table-column type="index" label="序号">
+          <template scope="scope">
+            <span v-if="scope.$index < 9">0{{ scope.$index + 1 }}</span>
+            <span v-else>{{ scope.$index + 1 }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="快递公司" prop="courierServicesCompany">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.courierServicesCompany"/>
+          </template>
+        </el-table-column>
+
+        <el-table-column align="center" label="已收到单号" prop="receivedNo">
+          <template slot-scope="scope">
+            <el-input
+              v-model="scope.row.receivedNo"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="内件明细" prop="internalDetails">
+          <template slot-scope="scope">
+            <el-input
+              v-model="scope.row.internalDetails"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="实重" prop="weight">
+          <template slot-scope="scope">
+            <el-input
+              v-model="scope.row.weight"/>
+          </template>
+        </el-table-column>
+
+        <el-table-column align="center" label="长" prop="long1">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.long1" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="宽" prop="wide">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.wide" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="高" prop="height">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.height" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="体积重" prop="bulkWeight">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.bulkWeight" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="备注" prop="remark">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.remark" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" class-name="small-padding fixed-width">
+          <template slot-scope="scope">
+            <el-button
+              type="danger"
+              size="mini"
+              @click.native.prevent="deleteRow(scope.$index, list)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import {
+  createMaritimeAdministration
+} from '@/api/MaritimeAdministration'
+import {
+  listMaritimeDetail
+} from '@/api/MaritimeDetail'
+import Pagination from '@/components/Pagination'
+export default {
+  name: 'MaritimeAdministrationedit',
+  components: { Pagination },
+  data() {
+    return {
+      list: null,
+      total: 0,
+      listLoading: false,
+      listQuery: {
+        page: 1,
+        limit: 100
+      },
+      dataForm: {
+        id: undefined,
+        amountPaid: 0,
+        amountIng: 0
+
+      },
+      dialogFormVisible: false,
+      submiting: false,
+      dialogStatus: '',
+      textMap: {
+        update: '编辑',
+        create: '创建'
+      },
+      rules: {}
+    }
+  },
+  created() {
+    this.listQuery.id = this.$route.query.id
+    this.getList()
+  },
+  methods: {
+    getList() {
+      this.listLoading = true
+      listMaritimeDetail(this.listQuery)
+        .then(response => {
+          debugger
+          this.dataForm = response.data.data
+          this.list = response.data.data.maritimeDetailDOS
+          this.total = response.data.data.total
+          this.listLoading = false
+        })
+        .catch(() => {
+          this.list = []
+          this.total = 0
+          this.listLoading = false
+        })
+    },
+    returnsales() {
+      this.$router.push({
+        path: 'MaritimeAdministration'
+      })
+    },
+    handleSelectionChange(val) {
+      this.modification = val
+    },
+    addDetail() {
+      console.log('add')
+      this.list.push({
+        courierServicesCompany: '',
+        receivedNo: '',
+        internalDetails: '',
+        weight: '',
+        long1: '',
+        wide: '',
+        height: '',
+        bulkWeight: '',
+        remark: ''
+      })
+    },
+    createData() {
+      this.listLoading = true
+      this.$refs['dataForm'].validate(valid => {
+        if (valid) {
+          this.submiting = true
+          this.dataForm.maritimeDetailDTOS = this.list
+          createMaritimeAdministration(this.dataForm)
+            .then(response => {
+              //   this.list.unshift(response.data.data)
+              this.dialogFormVisible = false
+              this.$notify.success({
+                title: '成功',
+                message: '添加成功'
+              })
+              this.submiting = false
+              this.returnsales()
+            })
+            .catch(response => {
+              this.$notify.error({
+                title: '失败',
+                message: response.data.errmsg
+              })
+              this.submiting = false
+            })
+        }
+      })
+    },
+    deleteRow(index, rows) {
+      rows.splice(index, 1)
+    }
+  }
+}
+</script>
+<style lang="scss">
+.bg-left {
+  padding-left: 30px;
+}
+.bg-right {
+  padding-right: 10px;
+  text-align: right;
+}
+.bg-bottom {
+  margin: 15px 0px;
+}
+.title-style {
+  background: #f6f7fc;
+  border-radius: 5px;
+}
+.title::before {
+  content: "";
+  display: inline-block;
+  width: 5px;
+  height: 30px;
+  background: #5473e8;
+  position: absolute;
+  left: 0;
+}
+.position {
+  position: relative;
+}
+.small-title {
+  position: relative;
+  padding: 10px;
+  font-weight: 600;
+  margin: 20px 0;
+}
+.small-title::before {
+  position: absolute;
+  content: "";
+  display: block;
+  background: #5473e8;
+  width: 4px;
+  height: 14px;
+  left: 0px;
+  top: 13px;
+}
+.el-form {
+  padding: 0 40px;
+}
+.ws-info-table {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  border-left: 1px solid #ccc;
+  border-top: 1px solid #ccc;
+  position: relative;
+  border-left: 0;
+  border-top: 0;
+}
+.input-width {
+  width: 200px;
+}
+</style>

unimall-admin/src/views/productSales/productSales.vue

@@ -2,6 +2,22 @@
   <div class="app-container">
     <!-- 查询和其他操作 -->
     <div class="filter-container">
+      <el-input
+        v-model="listQuery.type.customer"
+        clearable
+        class="filter-item"
+        size="small"
+        style="width: 200px;"
+        placeholder="请输入客户名称"
+      />
+      <el-input
+        v-model="listQuery.type.tradeName"
+        clearable
+        class="filter-item"
+        size="small"
+        style="width: 200px;"
+        placeholder="请输入商品名称"
+      />
       <el-button
         v-permission="['productSales:productsales:list']"
         class="filter-item"
@@ -18,18 +34,51 @@
         icon="el-icon-edit"
         @click="handleCreate"
       >添加</el-button>
+      <el-button
+        class="filter-item"
+        type="primary"
+        size="mini"
+        icon="el-icon-edit"
+        @click="exportlist"
+      >导出</el-button>
+
+      <el-upload
+        :on-change="importClick"
+        :show-file-list="false"
+        :auto-upload="false"
+        style="margin-left: 8px;margin-bottom:0"
+        class="filter-item"
+        action=""
+        accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
+        <el-button
+          class="filter-item"
+          type="primary"
+          size="mini"
+          style="height:32px"
+          icon="el-icon-edit">导入</el-button>
+      </el-upload>
     </div>
 
     <!-- 查询结果 -->
     <el-table
       v-loading="listLoading"
       :data="list"
+      :summary-method="getSummaries"
       size="small"
       element-loading-text="正在查询中。。。"
       border
       fit
       highlight-current-row
+      show-summary
+      @selection-change="handleSelectionChange"
     >
+      <el-table-column :selectable="selectInit" type="selection" />
+      <el-table-column type="index" label="序号">
+        <template scope="scope">
+          <span v-if="scope.$index < 9">0{{ scope.$index + 1 }}</span>
+          <span v-else>{{ scope.$index + 1 }}</span>
+        </template>
+      </el-table-column>
       <el-table-column align="center" label="日期" prop="saleDate" />
       <el-table-column align="center" label="销售单号" prop="saleNo" />
       <el-table-column align="center" label="客户名称" prop="customer" />
@@ -70,13 +119,14 @@
       </el-table-column>
     </el-table>
 
-    <pagination
-      v-show="total>0"
+    <el-pagination
+      :current-page="currentPage"
+      :page-sizes="[100, 200, 300, 400,1000,1500,2000]"
+      :page-size="100"
       :total="total"
-      :page.sync="listQuery.page"
-      :limit.sync="listQuery.limit"
-      @pagination="getList"
-    />
+      layout="total, sizes, prev, pager, next, jumper"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"/>
 
     <!-- 添加或修改对话框 -->
     <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
@@ -85,14 +135,14 @@
         :rules="rules"
         :model="dataForm"
         status-icon
-        label-position="left"
+        label-position="right"
         label-width="100px"
-        style="width: 400px; margin-left:50px;"
+        style=""
       >
         <el-form-item label="id" prop="id" hidden>
           <el-input v-model="dataForm.id" />
         </el-form-item>
-        <el-form-item label="日期" prop="saleDate">
+        <el-form-item label="日期" prop="saleDate" class="item-style">
           <!-- <el-input v-model="dataForm.receiptPaymentDate" /> -->
           <el-date-picker
             v-model="dataForm.saleDate"
@@ -102,67 +152,74 @@
             value-format="yyyy-MM-dd"
           />
         </el-form-item>
-        <el-form-item label="销售单号" prop="saleNo">
+        <el-form-item label="销售单号" prop="saleNo" class="item-style">
           <el-input v-model="dataForm.saleNo" />
         </el-form-item>
-        <el-form-item label="客户名称" prop="customer">
+        <el-form-item label="客户名称" prop="customer" class="item-style">
           <el-input v-model="dataForm.customer" />
         </el-form-item>
-        <el-form-item label="电话" prop="phone">
+        <el-form-item label="电话" prop="phone" class="item-style">
           <el-input v-model="dataForm.phone" />
         </el-form-item>
-        <el-form-item label="备注" prop="remark">
+        <el-form-item label="备注" prop="remark" class="item-style">
           <el-input v-model="dataForm.remark" />
         </el-form-item>
-        <el-form-item label="商品名称" prop="tradeName">
+        <el-form-item label="商品名称" prop="tradeName" class="item-style">
           <el-input v-model="dataForm.tradeName" />
         </el-form-item>
-        <el-form-item label="货品" prop="articleNo">
+        <el-form-item label="货品" prop="articleNo" class="item-style">
           <el-input v-model="dataForm.articleNo" />
         </el-form-item>
-        <el-form-item label="规格型号" prop="specification">
+        <el-form-item label="规格型号" prop="specification" class="item-style">
           <el-input v-model="dataForm.specification" />
         </el-form-item>
-        <el-form-item label="销售数量" prop="num">
+        <el-form-item label="销售数量" prop="num" class="item-style">
           <el-input v-model="dataForm.num" />
         </el-form-item>
-        <el-form-item label="单位" prop="unit">
+        <el-form-item label="单位" prop="unit" class="item-style">
           <el-input v-model="dataForm.unit" />
         </el-form-item>
-        <el-form-item label="期初库存" prop="openingInventory">
+        <el-form-item label="期初库存" prop="openingInventory" class="item-style">
           <el-input v-model="dataForm.openingInventory" />
         </el-form-item>
-        <el-form-item label="当前库存" prop="currentInventory">
+        <el-form-item label="当前库存" prop="currentInventory" class="item-style">
           <el-input v-model="dataForm.currentInventory" />
         </el-form-item>
-        <el-form-item label="单价" prop="price">
+        <el-form-item label="单价" prop="price" class="item-style">
           <el-input v-model="dataForm.price"/>
         </el-form-item>
-        <el-form-item label="单盒成本" prop="singleCost">
+        <el-form-item label="单盒成本" prop="singleCost" class="item-style">
           <el-input v-model="dataForm.singleCost" />
         </el-form-item>
-        <el-form-item label="折扣" prop="discount">
+        <el-form-item label="折扣" prop="discount" class="item-style">
           <el-input v-model="dataForm.discount" />
         </el-form-item>
-        <el-form-item label="折后价" prop="discountedPrice">
+        <el-form-item label="折后价" prop="discountedPrice" class="item-style">
           <el-input v-model="dataForm.discountedPrice" />
         </el-form-item>
-        <el-form-item label="应收金额" prop="amountReceivable">
+        <el-form-item label="应收金额" prop="amountReceivable" class="item-style">
           <el-input v-model="dataForm.amountReceivable" />
         </el-form-item>
-        <el-form-item label="实收金额" prop="paidAmount">
+        <el-form-item label="实收金额" prop="paidAmount" class="item-style">
           <el-input v-model="dataForm.paidAmount" />
         </el-form-item>
-        <el-form-item label="总成本" prop="totalCost">
+        <el-form-item label="总成本" prop="totalCost" class="item-style">
           <el-input v-model="dataForm.totalCost" />
         </el-form-item>
-        <el-form-item label="毛利润" prop="paidAmount">
+        <el-form-item label="毛利润" prop="paidAmount" class="item-style">
           <el-input v-model="dataForm.paidAmount" />
         </el-form-item>
-        <el-form-item label="支付方式" prop="payType">
-          <el-input v-model="dataForm.payType" />
+        <el-form-item label="支付方式" prop="payType" class="item-style">
+          <!-- <el-input v-model="dataForm.payType" /> -->
+          <el-select v-model="dataForm.payType" placeholder="请选择支付方式" style="width:100%">
+            <el-option
+              v-for="(item, index) in payList"
+              :label="item.type"
+              :value="item.type"
+              :key="index"/>
+          </el-select>
         </el-form-item>
-        <el-form-item label="备注" prop="remarks">
+        <el-form-item label="备注" prop="remarks" class="item-style">
           <el-input v-model="dataForm.remarks" />
         </el-form-item>
       </el-form>
@@ -185,7 +242,9 @@ import {
   listProductSales,
   createProductSales,
   updateProductSales,
-  deleteProductSales
+  deleteProductSales,
+  exportXlsx,
+  importWord
 } from '@/api/productSales'
 import Pagination from '@/components/Pagination'
 export default {
@@ -193,12 +252,31 @@ export default {
   components: { Pagination },
   data() {
     return {
+      payList1: [],
+      payList: [
+        {
+          type: '现金'
+        },
+        {
+          type: '微信'
+        },
+        {
+          type: '银行转账'
+        }
+      ],
+      currentPage: 1,
+      excelFreightspace: [],
+      modification: [],
       list: null,
       total: 0,
       listLoading: true,
       listQuery: {
         page: 1,
-        limit: 20
+        limit: 20,
+        type: {
+          customer: '',
+          tradeName: ''
+        }
       },
       dataForm: {
         id: undefined
@@ -215,8 +293,209 @@ export default {
   },
   created() {
     this.getList()
+    this.currentPage = 1
   },
   methods: {
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`)
+      this.listQuery.limit = val
+      this.getList()
+    },
+    handleCurrentChange(val) {
+      this.listQuery.page = val
+      console.log(`当前页: ${val}`)
+      this.getList()
+    },
+    getSummaries(param) {
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = '合计'
+          return
+        } else if (index == 18||index == 19||index == 20||index == 21) {
+          const values = data.map((item) => Number(item[column.property]))
+          if (!values.every((value) => isNaN(value))) {
+            sums[index] = values.reduce((prev, curr) => {
+              const value = Number(curr)
+              if (!isNaN(value)) {
+                return prev + curr
+              } else {
+                return prev
+              }
+            }, 0)
+            sums[index] += ''
+          } else {
+            sums[index] = '--'
+          }
+        } else {
+          // sums[index] = "--";
+        }
+      })
+
+      return sums
+    },
+    importClick(file, fileList) {
+      this.fileTemp = file.raw
+      const fileName = file.raw.name
+      const fileType = fileName.substring(fileName.lastIndexOf('.') + 1)
+      // 判断上传文件格式
+      if (this.fileTemp) {
+        if (fileType == 'xlsx' || fileType == 'xls') {
+          this.importf(this.fileTemp)
+        } else {
+          this.$message({
+            type: 'warning',
+            message: '附件格式错误，请删除后重新上传！'
+          })
+        }
+      } else {
+        this.$message({
+          type: 'warning',
+          message: '请上传附件！'
+        })
+      }
+    },
+    importf(obj) {
+      this.excelFreightspace = []
+      // this.dialogVisible = true;
+      const _this = this
+      const inputDOM = this.$refs.inputer // 通过DOM取文件数据
+      this.file = event.currentTarget.files[0]
+      var rABS = false // 是否将文件读取为二进制字符串
+      var f = this.file
+      var reader = new FileReader()
+      // if (!FileReader.prototype.readAsBinaryString) {
+      FileReader.prototype.readAsBinaryString = function(f) {
+        var binary = ''
+        var rABS = false // 是否将文件读取为二进制字符串
+        var pt = this
+        var wb // 读取完成的数据
+        var outdata
+        var reader = new FileReader()
+        reader.onload = function(e) {
+          var bytes = new Uint8Array(reader.result)
+          var length = bytes.byteLength
+          for (var i = 0; i < length; i++) {
+            binary += String.fromCharCode(bytes[i])
+          }
+          var XLSX = require('xlsx')
+          if (rABS) {
+            wb = XLSX.read(btoa(fixdata(binary)), {
+              // 手动转化
+              type: 'base64',
+              cellDates: true
+            })
+          } else {
+            wb = XLSX.read(binary, {
+              type: 'binary'
+            })
+          }
+          // outdata就是你想要的东西 excel导入的数据
+          outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]])
+          // excel 数据再处理
+          const arr = []
+          outdata.map(v => {
+            // let jsonString = JSON.stringify(v).replace(/\*/g, '').replace(/\s/ig,'');
+            const jsonString = JSON.stringify(v)
+              .replace(/\//g, '')
+              .replace(/\s/gi, '')
+            v = JSON.parse(jsonString)
+            const obj = {}
+            // xxx代表列名
+            debugger
+            obj.saleDate = v.日期
+            obj.saleNo = v.销售单号
+            obj.customer = v.客户名称
+            obj.phone = v.电话
+            obj.remark = v.备注
+            obj.tradeName = v.商品名称
+            obj.articleNo = v.货品
+            obj.specification = v.规格型号
+            obj.num = v.销售数量
+            obj.unit = v.单位
+            obj.remarks = v.备注
+            obj.openingInventory = v.期初库存
+            obj.currentInventory = v.当前库存
+            obj.price = v.单价
+            obj.singleCost = v.单盒成本
+            obj.discount = v.折扣
+            obj.discountedPrice = v.折后价
+            obj.amountReceivable = v.应收金额
+            obj.paidAmount = v.实收金额
+            obj.totalCost = v.总成本
+            obj.paidAmount = v.毛利润
+            obj.payType = v.支付方式
+            obj.remarks = v.备注
+            for (let i = 0; i < _this.payList.length; i++) {
+              _this.payList1.push(_this.payList[i].type)
+            }
+            if (!_this.payList1.includes(obj.payType)) {
+              _this.isAllowExport = false
+              _this.$notify({
+                title: '失败',
+                message: '导入失败，导入数据中支付方式在系统中不存在，请重新编辑',
+                type: 'error'
+              })
+              return
+            } else {
+              _this.excelFreightspace.push(obj)
+              _this.isAllowExport = true
+            }
+          })
+          if (_this.excelFreightspace && _this.isAllowExport) {
+            importWord(_this.excelFreightspace).then(response => {
+              if (response.status == '200') {
+                _this.$notify({
+                  title: '成功',
+                  message: '导入成功',
+                  type: 'success'
+                })
+                _this.getList()
+              }
+            })
+          }
+        }
+        reader.readAsArrayBuffer(f)
+      }
+      if (rABS) {
+        reader.readAsArrayBuffer(f)
+      } else {
+        reader.readAsBinaryString(f)
+      }
+    },
+    handleSelectionChange(val) {
+      this.modification = val
+    },
+    selectInit(row) {
+      return true
+    },
+    async exportlist() {
+      debugger
+      if (this.modification.length == 0) {
+        this.$message.warning('请选择要导出的条目！')
+      } else {
+        console.log('导出数据', this.modification)
+        const _data = {
+          productSalesDTOS: this.modification
+        }
+        const {
+          data
+        } = await exportXlsx(_data).then((response) => { debugger
+          this.download(response.data.data)
+          //   downloadFile({
+          //     res: data,
+          //     fileName: `${
+          //     this.date.year + (this.date.month ? `-${this.date.month}` : '')
+          //     }付款信息`,
+          //     type: 'xls',
+          //     })
+          if (response.status == '200') {
+
+          }
+        })
+      }
+    },
     getList() {
       this.listLoading = true
       listProductSales(this.listQuery)
@@ -344,3 +623,10 @@ export default {
   }
 }
 </script>
+<style lang="scss">
+  .item-style{
+    width :48%;
+    display: inline-block;
+    // margin-left: 20px;
+  }
+</style>