货代海运出口添加箱改成行编辑 2023-11-29

src/enums/column-name.js

@@ -1374,6 +1374,10 @@ const columnName = [{
     name: '货运代理-海运出口'
   },
   {
+    code: 309.1,
+    name: '货运代理-海运出口-委托详情-箱类型'
+  },
+  {
     code: 310,
     name: '货运代理-账单管理-费用中心'
   },

src/router/views/index.js

@@ -2860,7 +2860,7 @@ export default [{
     hidden: true,
     children: [{
       path: '/iosBasicData/fininvoices/index',
-      name: '发票中心(F)',
+      name: '进项发票(F)',
       meta: {
         i18n: '/iosBasicData/fininvoices/index',
         keepAlive: true,
@@ -2868,6 +2868,20 @@ export default [{
       component: () => import( /* webpackChunkName: "views" */ '@/views/iosBasicData/fininvoices/index.vue')
     }]
   },
+  {
+    path: '/iosBasicData/fininvoicesOutput/index',
+    component: Layout,
+    hidden: true,
+    children: [{
+      path: '/iosBasicData/fininvoicesOutput/index',
+      name: '销项发票(F)',
+      meta: {
+        i18n: '/iosBasicData/fininvoicesOutput/index',
+        keepAlive: true,
+      },
+      component: () => import( /* webpackChunkName: "views" */ '@/views/iosBasicData/fininvoicesOutput/index.vue')
+    }]
+  },
   // 调拨(L)
   {
     path: '/tirePartsMall/salesManagement/outboundWorkOrderL/index',

src/views/iosBasicData/SeafreightExportF/bills/assembly/EntrustmentLnformation/precontainers.vue

@@ -12,7 +12,9 @@
                @row-save="rowSave"
                @row-del="rowDel"
                @selection-change="selectionChange"
-               @refresh-change="refreshChange">
+               @refresh-change="refreshChange"
+               @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 309.1)"
+               @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 309.1)">
       <template slot="menuLeft">
           <el-button
               type="primary"
@@ -39,19 +41,19 @@
                 icon="el-icon-edit"
                 @click.stop="editfun(scope.row, scope.index)"
                 :disabled="seeDisabled">
-                编辑
+                {{scope.row.$cellEdit?'保存':'编辑'}}
             </el-button>
             <el-button
                 size="mini"
                 type="text"
                 icon="el-icon-delete"
                 :disabled="seeDisabled"
-                @click.stop="rowDel"
+                @click.stop="rowDel(scope.row)"
             >删 除</el-button>
         </template>
         <template slot-scope="{row}" slot="cntrTypeCodeForm">
             <search-query :datalist="cntrTypeCodeData"
-                          :selectValue="form.cntrTypeCode"
+                          :selectValue="row.cntrTypeCode"
                           :filterable="true"
                           :clearable="true"
                           :remote="true"
@@ -98,7 +100,8 @@
           total: 0
         },
         selectionList: [],
-        option: {
+        option:{},
+        optionBack: {
           height:'180',
           calcHeight: 30,
           tip: false,
@@ -110,70 +113,52 @@
           selection: true,
             labelWidth:'120',
           dialogClickModal: false,
+            updateBtn:false,
+            saveBtn:false,
+            cancelBtn:false,
+            cellBtn:true, // 行编辑
           column: [
-            // {
-            //   label: "主表id",
-            //   prop: "pid",
-            //   rules: [{
-            //     required: true,
-            //     message: "请输入主表id",
-            //     trigger: "blur"
-            //   }]
-            // },
             {
               label: "尺码箱型",
               prop: "cntrTypeCode",
                 formslot: true,
               width:'120',
+                cell:true,
             },
             {
               label: "箱量",
               prop: "quantity",
               width:'120',
-              rules: [{
-                required: true,
-                message: "请输入箱量",
-                trigger: "blur"
-              }]
+                cell:true,
             },
             {
               label: "毛重(KGM)",
               prop: "grossWeight",
               width:'120',
-              rules: [{
-                required: true,
-                message: "请输入毛重 (KGM)",
-                trigger: "blur"
-              }]
+                cell:true,
             },
             {
               label: "净重(KGM)",
               prop: "netWeight",
               width:'120',
-              rules: [{
-                required: true,
-                message: "请输入净重 (KGM)",
-                trigger: "blur"
-              }]
+                cell:true,
             },
             {
               label: "体积(CBM)",
               prop: "measurement",
               width:'120',
-              rules: [{
-                required: true,
-                message: "请输入体积 (CBM)",
-                trigger: "blur"
-              }]
+                cell:true,
             },
             {
               label: "温度",
               prop: "temperature",
+                cell:true,
             },
             {
               label: "温度单位",
               prop: "temperatureUnit",
               type: 'select',
+                cell:true,
                 dicData: [{
                     label: '摄氏度',
                     value: 'C'
@@ -185,16 +170,19 @@
             {
               label: "通风度",
               prop: "ventilation",
+                cell:true,
             },
             {
               label: "湿度",
               prop: "humidity",
+                cell:true,
             },
             {
               label: "是否货主自有箱",
               prop: "isSoc",
               width:'120',
               type: 'select',
+                cell:true,
               dicData: [{
                   label: '否',
                   value: 0
@@ -207,6 +195,7 @@
               label: "是否单程",
               prop: "isOneway",
               type: 'select',
+                cell:true,
               dicData: [{
                  label: '否',
                  value: 0
@@ -215,15 +204,6 @@
                 value: 1
               }]
             },
-            // {
-            //   label: "状态（0 正常 1停用）",
-            //   prop: "status",
-            //   rules: [{
-            //     required: true,
-            //     message: "请输入状态（0 正常 1停用）",
-            //     trigger: "blur"
-            //   }]
-            // },
             {
               label: "备注",
               prop: "remarks",
@@ -256,10 +236,8 @@
         return ids.join(",");
       }
     },
-      created() {
-          if (this.seeDisabled){
-
-          }
+      async created() {
+          this.option = await this.getColumnData(this.getColumnName(309.1), this.optionBack);
       },
       methods: {
         // 平均箱量
@@ -344,8 +322,8 @@
         corpChange(value,row) {
             for (let item of this.cntrTypeCodeData) {
                 if (item.cnName == value) {
-                    this.$set(this.form,'cntrTypeCode',item.cnName)
-                    this.$set(this.form,'teu',item.teu)
+                    this.$set(row,'cntrTypeCode',item.cnName)
+                    this.$set(row,'teu',item.teu)
                 }
             }
         },
@@ -402,34 +380,55 @@
         });
       },
           // 编辑确认按钮
-      rowUpdate(row, index, done, loading) {
-          if (row.id) {
-              // 如果是冻柜，则需要输入相应的通度和温度、温度，如果不是冻柜，不需要输入相应的温度等内容；
-              if (this.assemblyForm.cargoType == 'reefer') {
-                  // 要判断的必填
-                  const arr = [
-                      {
-                          name: "温度",
-                          value: "temperature",
-                      },
-                      {
-                          name: "温度单位",
-                          value: "temperatureUnit",
-                      },
-                      {
-                          name: "通风度",
-                          value: "ventilation",
-                      },
-                      {
-                          name: "湿度",
-                          value: "humidity",
-                      },
-                  ]
-                  if (!requiredMessage(row,arr)) {
-                      loading(); // 按钮的禁用关闭
-                      return;
-                  }
+      rowUpdate(row, index) {
+            let rulesRow = [
+                {
+                    name: "尺码箱型",
+                    value: "cntrTypeCode",
+                },
+                {
+                    name: "箱量",
+                    value: "quantity",
+                },
+                {
+                    name: "毛重(KGM)",
+                    value: "grossWeight",
+                },
+                {
+                    name: "体积(CBM)",
+                    value: "measurement",
+                }
+
+            ]
+          if (!requiredMessage(row,rulesRow)) {
+              return;
+          }
+          // 如果是冻柜，则需要输入相应的通度和温度、温度，如果不是冻柜，不需要输入相应的温度等内容；
+          if (this.assemblyForm.cargoType == 'reefer') {
+              // 要判断的必填
+              const arr = [
+                  {
+                      name: "温度",
+                      value: "temperature",
+                  },
+                  {
+                      name: "温度单位",
+                      value: "temperatureUnit",
+                  },
+                  {
+                      name: "通风度",
+                      value: "ventilation",
+                  },
+                  {
+                      name: "湿度",
+                      value: "humidity",
+                  },
+              ]
+              if (!requiredMessage(row,arr)) {
+                  return;
               }
+          }
+          if (row.id) {
               this.$confirm("已经存在配箱信息,如果修改预配箱数据 要清除全部配箱信息?", {
                   confirmButtonText: "确定",
                   cancelButtonText: "取消",
@@ -440,23 +439,20 @@
                           type: "success",
                           message: "操作成功!"
                       });
+                      this.$set(row,'$cellEdit',false)
                       this.$emit('billsDetailfun')
-                      done();
                   })
-              }).catch(()=>{
-                  done();
               })
           }else {
               row.pid = this.pid
               precontainersSubmit(row).then(() => {
-                  this.onLoad(this.page);
                   this.$message({
                       type: "success",
                       message: "操作成功!"
                   });
-                  done();
+                  this.$set(row,'$cellEdit',false)
+                  this.$emit('billsDetailfun')
               }, error => {
-                  loading();
                   console.log(error);
               });
           }
@@ -468,15 +464,22 @@
           type: "warning"
         })
           .then(() => {
-            return precontainersRemove(row.id);
+              if (!row.id) {
+                  this.$message({
+                      type: "success",
+                      message: "操作成功!"
+                  });
+                  this.assemblyForm.preContainersList.splice(row.$index,1)
+              }else {
+                  precontainersRemove(row.id).then(() => {
+                      this.$message({
+                          type: "success",
+                          message: "操作成功!"
+                      });
+                      this.$emit('billsDetailfun')
+                  });
+              }
           })
-          .then(() => {
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$emit('billsDetailfun')
-          });
       },
       // 新增
       addfun(){
@@ -487,11 +490,19 @@
               });
               return
           }
-         this.$refs.crud.rowAdd()
+          this.$refs.crud.rowCellAdd({})
+         // this.$refs.crud.rowAdd()
       },
       // 编辑
       editfun(row,index){
-          this.$refs.crud.rowEdit(row,index)
+          if (row.$cellEdit) {
+              // 保存
+              this.rowUpdate(row,index)
+              // this.$set(row,'$cellEdit',false)
+          }else {
+              this.$set(row,'$cellEdit',true)
+          }
+          // this.$refs.crud.rowEdit(row,index)
       },
       // 多选删除
       handleDelete() {
@@ -535,6 +546,30 @@
           console.log('刷新')
       },
 
+          //自定义列保存
+          async saveColumnTwo(ref, option, optionBack, code) {
+              /**
+               * 已定义全局方法，直接使用，saveColumnData保存列数据方法,参数传值(表格名称，当前表格的option数据)
+               * 已定义全局方法，直接使用，getColumnName方法用来获取枚举值，参数根据自己定义的code值获取中文名
+               * 一定要执行异步操作，要等接口成功返回，才能执行下一行代码
+               */
+              const inSave = await this.saveColumnData(this.getColumnName(code), this[option]);
+              if (inSave) {
+                  this.$message.success("保存成功");
+                  //关闭窗口
+                  this.$refs[ref].$refs.dialogColumn.columnBox = false;
+              }
+          },
+          //自定义列重置
+          async resetColumnTwo(ref, option, optionBack, code) {
+              this[option] = this[optionBack];
+              const inSave = await this.delColumnData(this.getColumnName(code), this[optionBack]);
+              if (inSave) {
+                  this.$message.success("重置成功");
+                  this.$refs[ref].$refs.dialogColumn.columnBox = false;
+              }
+          },
+
     }
   };
 </script>

src/views/iosBasicData/fininvoices/index.vue

@@ -655,7 +655,7 @@ import finstlbillsDetails from "@/views/iosBasicData/finstlbills/finstlbillsDeta
       },
       onLoad(page, params = {}) {
         this.loading = true;
-        fininvoicesList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        fininvoicesList(page.currentPage, page.pageSize, {...Object.assign(params, this.query),type:"进项"}).then(res => {
           const data = res.data.data;
           this.page.total = data.total;
           this.data = data.records;

src/views/iosBasicData/fininvoicesOutput/assembly/fininvoicesitems.vue

@@ -0,0 +1,374 @@
+<template>
+    <div>
+        <el-table
+            ref="tableRef"
+            :cell-style="{padding:'0px',fontSize:'12px'}"
+            :header-cell-style="tableHeaderCellStyle"
+            :data="tableData"
+            border
+            style="width: 100%"
+            @selection-change="handleSelectionChange"
+            @row-click="rowClick"
+            :row-style="rowStyle"
+            :row-class-name="rowClassName" >
+            <el-table-column
+                fixed="left"
+                type="selection"
+                width="55">
+            </el-table-column>
+            <el-table-column
+                prop="lineNo"
+                label="行号">
+            </el-table-column>
+            <el-table-column
+                prop="businessType"
+                label="业务类型">
+            </el-table-column>
+            <el-table-column
+                prop="billType"
+                label="单据类型">
+            </el-table-column>
+            <el-table-column
+                prop="billNo"
+                label="单据编号">
+                <template slot-scope="{row}">
+                    <span class="textHide">{{row.mblno}}</span>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="description"
+                label="收费内容">
+            </el-table-column>
+            <el-table-column
+                prop="descriptionMerge"
+                label="合并收费内容" width="120px">
+            </el-table-column>
+            <el-table-column
+                prop="isChequeSigned"
+                label="支票是否签收" width="120px">
+            </el-table-column>
+            <el-table-column
+                prop="isInvoiceSigned"
+                label="发票是否签收" width="120px">
+            </el-table-column>
+            <el-table-column
+                prop="amount"
+                label="账单金额">
+            </el-table-column>
+            <el-table-column
+                prop="currentCurCode"
+                label="本次发票币种" width="120px">
+                <template slot-scope="{row}">
+                    <search-query :datalist="curCodeData"
+                                  :selectValue="row.currentCurCode"
+                                  :filterable="true"
+                                  :clearable="true"
+                                  :remote="true"
+                                  :buttonIf="false"
+                                  :forParameter="{key:'id',label:'code',value:'code'}"
+                                  @remoteMethod="getRateListfun"
+                                  @corpChange="corpChange($event,row)"
+                                  @corpFocus="getRateListfun">
+                    </search-query>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="currentExrate"
+                label="本次发票汇率" width="100px">
+            </el-table-column>
+            <el-table-column
+                prop="currentTaxRate"
+                label="本次发票税率" width="100px">
+                <template slot-scope="{row}">
+                    <el-input style="width: 100%;" v-model="row.currentTaxRate"
+                              size="mini" autocomplete="off"
+                              clearable placeholder="请输入本次发票税率" @input="currentInput" >
+                    </el-input>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="currentSurRate"
+                label="本次发票附加税率" width="120px">
+                <template slot-scope="{row}">
+                    <el-input style="width: 100%;" v-model="row.currentSurRate"
+                              size="mini" autocomplete="off"
+                              clearable placeholder="请输入本次发票附加税率" @input="currentInput(row)" >
+                    </el-input>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="currentAmountTax"
+                label="税额">
+            </el-table-column>
+            <el-table-column
+                prop="currentAmountNet"
+                label="去税金额">
+            </el-table-column>
+            <el-table-column
+                prop="uninvoicedAmount"
+                label="已开发票金额" width="120px">
+            </el-table-column>
+            <el-table-column
+                prop="currentAmount"
+                label="本次发票金额" width="120px">
+                <template slot-scope="{row}">
+                    <el-input style="width: 100%;" v-model="row.currentAmount"
+                              size="mini" autocomplete="off"
+                              clearable placeholder="请输入本次发票金额" >
+                    </el-input>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="currentAmountLoc"
+                label="本次发票本币金额" width="120px">
+            </el-table-column>
+            <el-table-column
+                prop="billDate"
+                label="开票日期" width="140px">
+            </el-table-column>
+            <el-table-column
+                prop="corpCnName"
+                label="客户中文名称" width="140px">
+                <template slot-scope="{row}">
+                    <span class="textHide">{{row.corpCnName}}</span>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="corpEnName"
+                label="客户英文名称" width="140px">
+                <template slot-scope="{row}">
+                    <span class="textHide">{{row.corpEnName}}</span>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="mblno"
+                label="MB/L NO">
+                <template slot-scope="{row}">
+                    <span class="textHide">{{row.mblno}}</span>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="hblno"
+                label="HB/L NO">
+            </el-table-column>
+            <el-table-column
+                prop="feeCnName"
+                label="费用名称">
+            </el-table-column>
+            <el-table-column
+                prop="paymode"
+                label="付款方式">
+            </el-table-column>
+            <el-table-column
+                prop="accBillNo"
+                label="账单编号">
+                <template slot-scope="{row}">
+                    <span class="textHide">{{row.mblno}}</span>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="accDate"
+                label="账单日期">
+                <template slot-scope="{row}">
+                    <span class="textHide">{{row.mblno}}</span>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="dc"
+                label="费用收付">
+            </el-table-column>
+            <el-table-column
+                prop="lineNo"
+                label="备注">
+            </el-table-column>
+        </el-table>
+    </div>
+</template>
+
+<script>
+    import SearchQuery from "@/components/iosbasic-data/searchquery.vue";
+    import {getRateList} from "@/api/iosBasicData/rateManagement";
+
+    export default {
+        components: {SearchQuery},
+        props:{
+            tableData:{
+                type:Array,
+                default:[]
+            },
+            handleSelectionData:{
+                type:Array,
+                default:[],
+            }
+        },
+        data(){
+            return {
+                curCodeData:[], // 本次币种
+            }
+        },
+        methods:{
+            // 下拉回调
+            corpChange(value,row){
+                console.log(value)
+                for (let item of this.curCodeData) {
+                    if (item.code == value) {
+                        this.$set(row,'currentCurCode',item.code)
+                        this.$set(row,'currentExrate',item.exrate) // 本次发票税率
+
+                        if (value == 'USD') {
+                            this.$set(row,'currentAmountLoc',(Number(row.amount) * Number(row.currentExrate)).toFixed(2))
+                        }else {
+                            this.$set(row,'currentAmountLoc',row.amount)
+                        }
+                    }
+                }
+            },
+            // 税率监听
+            currentInput(row){
+                // 税额 两个税率加起来 / 100 乘 账单金额
+                let current = Number(row.currentTaxRate) + Number(row.currentSurRate)
+                this.$set(row,'currentAmountTax',(current / 100) * Number(row.amount)) // 税额
+                this.$set(row,'currentAmountNet',Number(row.amount) - row.currentAmountTax) // 去税金额
+            },
+            // 获取币别数据
+            getRateListfun(cnName){
+                getRateList({current:1,size:10,cnName}).then(res=>{
+                    this.curCodeData = res.data.data.records
+                })
+            },
+
+            // 表头样式
+            tableHeaderCellStyle({row,column,rowIndex, columnIndex}){
+                return "padding:4px 0px;fontSize:12px;color:#000;background:#ecf5ff"
+            },
+            // 多选选择的数据
+            handleSelectionChange(arr){
+                this.$emit('handleSelectionChange',arr)
+            },
+            // 监听点击表格事件
+            rowClick(row, column, event) {
+                let refsElTable = this.$refs.tableRef; // 获取表格对象
+                if (this.CtrlDown) {
+                    refsElTable.toggleRowSelection(row); // ctrl多选 如果点击两次同样会取消选中
+                    return;
+                }
+                if ( this.shiftOrAltDown && this.handleSelectionData.length > 0) {
+                    // 通过rowIndex判断已选择的行中最上面和最下面的是哪行，再对比按住shift/alt点击的当前行得到新的最上面和最下面的行，把这两行中间的行进行循环选中。
+                    let topAndBottom = this.getTopAndBottom(  row, this.bottomSelectionRow, this.topSelectionRow );
+                    refsElTable.clearSelection(); //先清空 不然会导致在这两行中间之外的行状态不变
+                    for (let index = topAndBottom.top; index <= topAndBottom.bottom; index++) { //选中两行之间的所有行
+                        refsElTable.toggleRowSelection(this.tableData[index], true);
+                    }
+                } else {
+                    let findRow = this.handleSelectionData.find(c => c.rowIndex == row.rowIndex); //找出当前选中行
+                    //如果只有一行且点击的也是这一行则取消选择 否则清空再选中当前点击行
+                    if (findRow&& this.handleSelectionData.length === 1 ) {
+                        refsElTable.toggleRowSelection(row, false);
+                        return;
+                    }
+                    // refsElTable.clearSelection(); // 清空之前选择的数据(如果放开，选择之前会变成单选)
+                    refsElTable.toggleRowSelection(row); // 调用选中行方法
+                }
+            },
+            // 行的 style 的回调方法
+            rowStyle({row,rowIndex}) {
+                // 直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象
+                // object: 要添加或者修改属性的目标对象；prop: 要定义或修改属性的名称；descript: 是一个对象，里面是我们上述的对象属性的特性；
+                Object.defineProperty(row, 'rowIndex', { //给每一行添加不可枚举属性rowIndex来标识当前行
+                    value: rowIndex, // 设置age的值，不设置的话默认为undefined
+                    writable: true, // 表示属性的值true可以修改,false不可以被修改
+                    enumerable: false, // 设置为false表示不能通过 for-in 循环返回
+                    // configurable: false, // configurable 设置为 false，意味着这个属性不能从对象上删除
+                })
+            },
+            keyDown(event) {
+                let key = event.keyCode;
+                if (key == 17) this.CtrlDown = true;
+                if (key == 16 || key == 18) this.shiftOrAltDown = true;
+            },
+            keyUp(event) {
+                let key = event.keyCode;
+                if (key == 17) this.CtrlDown = false;
+                if (key == 16 || key == 18) this.shiftOrAltDown = false;
+            },
+            // 文章说明 https://www.jianshu.com/p/48f2c522d2a2
+            getTopAndBottom(row, bottom, top){
+                let n = row.rowIndex,
+                    mx = bottom.rowIndex,
+                    mi = top.rowIndex;
+                if (n > mx) {
+                    return {
+                        top: mi,
+                        bottom: n
+                    };
+                } else if (n < mx && n > mi) {
+                    return {
+                        top: mi,
+                        bottom: n
+                    };
+                } else if (n < mi) {
+                    return {
+                        top: n,
+                        bottom: mx
+                    };
+                } else if (n == mi || n == mx) {
+                    return {
+                        top: mi,
+                        bottom: mx
+                    };
+                }
+            },
+            // 给选中行加上current-row这个class类，所以要使用row-class-name这个属性（其实给每一行添加rowIndex也可以用这个属性），
+            // 判断方式也是通过判断rowIndex对比
+            rowClassName({ row,  rowIndex }) {
+                let rowName = "",
+                    findRow = this.handleSelectionData.find(c => c.rowIndex === row.rowIndex);
+                if (findRow) {
+                    rowName = "current-row "; // elementUI 默认高亮行的class类 不用再样式了^-^,也可通过css覆盖改变背景颜色
+                }
+                return rowName; //也可以再加上其他类名 如果有需求的话
+            },
+        },
+        mounted() {
+            // 按住ctrl实现多选 设置监听keydown事件,以及keyup事件，
+            addEventListener("keydown", this.keyDown, false);
+            addEventListener("keyup", this.keyUp, false);
+        },
+        beforeDestroy() { //解绑
+            removeEventListener("keydown", this.keyDown);
+            removeEventListener("keyup", this.keyUp);
+        },
+        computed: { //实时得到最上行和最下行
+            bottomSelectionRow() {
+                if (this.handleSelectionData.length == 0) return null;
+                return this.handleSelectionData.reduce((start, end) => {
+                    return start.rowIndex > end.rowIndex ? start : end;
+                });
+            },
+            topSelectionRow() {
+                if (this.handleSelectionData.length == 0) return null;
+                return this.handleSelectionData.reduce((start, end) => {
+                    return start.rowIndex < end.rowIndex ? start : end;
+                });
+            }
+        },
+    }
+</script>
+
+<style scoped>
+.textHide {
+    width: 100%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+}
+::v-deep.current-row {
+    background: red;
+}
+.textHide {
+    width: 100%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+}
+</style>

src/views/iosBasicData/fininvoicesOutput/fininvoicesDetails.vue

@@ -0,0 +1,940 @@
+<template>
+    <div class="borderless" v-loading="pageLoading">
+        <div class="customer-head">
+            <div class="customer-back">
+                <el-button type="danger" style="border: none;background: none;color: red" icon="el-icon-arrow-left"
+                           @click="backToList">返回列表
+                </el-button>
+            </div>
+            <div class="add-customer-btn">
+                <el-button style="margin-left: 10px" type="primary"
+                           size="small"
+                           plain>导出到税控网络客户端
+                </el-button>
+                <el-button type="primary"
+                           size="small"
+                           plain>导出到税控
+                </el-button>
+                <el-button  size="small" type="warning" plain  style="margin-right: 8px" :disabled="!form.id" v-if="form.status == 1"
+                            :loading="saveLoading" @click="fininvoicesRevokeFinInvoicesfun">撤销发票
+                </el-button>
+                <el-button  size="small" type="success" plain  style="margin-right: 8px" :disabled="!form.id" v-else
+                            :loading="saveLoading" @click="fininvoicesConfirmFinInvoicesfun">确认发票
+                </el-button>
+                <el-button  size="small" type="primary" style="margin-right: 8px" v-if="editSave"
+                            :loading="saveLoading" @click="editHandle">编 辑
+                </el-button>
+                <el-button  size="small" type="primary" style="margin-right: 8px" v-else
+                            :loading="saveLoading" @click="editCustomer">保 存
+                </el-button>
+            </div>
+        </div>
+        <div style="margin: 55px 5px 0px 5px;'">
+            <el-form :model="form" ref="form" label-width="90px" class="demo-ruleForm">
+                <el-card class="box-card">
+                    <el-row>
+                        <el-col :span="5">
+                            <el-form-item label="业务编号" prop="billNo">
+                                <el-input style="width: 100%;" v-model="form.billNo"
+                                          size="small" autocomplete="off"
+                                          :disabled="true"
+                                          clearable placeholder="请输入业务编号" >
+                                </el-input>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="5">
+                            <el-form-item label="单据日期" prop="billDate">
+                                <el-date-picker v-model="form.billDate" clearable
+                                                style="width: 100%;"
+                                                type="date" size="small"
+                                                :disabled="true"
+                                                value-format="yyyy-MM-dd HH:mm"
+                                                placeholder="选择单据日期">
+                                </el-date-picker>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="5">
+                            <el-form-item label="制单人" prop="createUserName">
+                                <el-input style="width: 100%;" v-model="form.createUserName"
+                                          size="small" autocomplete="off"
+                                          :disabled="true"
+                                          clearable placeholder="请输入制单人" >
+                                </el-input>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="5">
+                            <el-form-item label="发票币种" prop="invCurCode">
+                                <search-query :datalist="invCurCodeData"
+                                              :selectValue="form.invCurCode"
+                                              :filterable="true"
+                                              :clearable="true"
+                                              :disabled="editSave"
+                                              :remote="true"
+                                              :buttonIf="false"
+                                              placeholder="请选择发票币种"
+                                              :forParameter="{key:'id',label:'code',value:'code'}"
+                                              @remoteMethod="invCurCodeRateListfun"
+                                              @corpChange="corpChange($event,'invCurCode')"
+                                              @corpFocus="invCurCodeRateListfun">
+                                </search-query>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="4">
+                            <el-form-item label="打印次数" prop="invCurCode">
+                                <el-input style="width: 100%;" v-model="form.invCurCode"
+                                          size="small" autocomplete="off"
+                                          :disabled="editSave"
+                                          clearable placeholder="请输入打印次数" >
+                                </el-input>
+                            </el-form-item>
+                        </el-col>
+                    </el-row>
+                </el-card>
+                <div class="flexBox" style="margin-top: 10px">
+                    <div class="cardBox flexBoxLeft">
+                        <el-row>
+                            <el-col :span="12">
+                                <el-form-item label="发票号码" prop="invoiceNo">
+                                    <el-input style="width: 100%;" v-model="form.invoiceNo"
+                                              size="small" autocomplete="off"
+                                              :disabled="true"
+                                              clearable placeholder="请输入发票号码" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="开票日期" prop="invoiceDate">
+                                    <el-date-picker v-model="form.invoiceDate" clearable
+                                                    style="width: 100%;"
+                                                    type="date" size="small"
+                                                    :disabled="true"
+                                                    value-format="yyyy-MM-dd HH:mm:ss"
+                                                    placeholder="选择开票日期">
+                                    </el-date-picker>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="24">
+                                <el-form-item label="税号" prop="invCorpTaxNo">
+                                    <el-input style="width: 100%;" v-model="form.invCorpTaxNo"
+                                              size="small" autocomplete="off"
+                                              :disabled="true"
+                                              clearable placeholder="请输入税号" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="24">
+                                <el-form-item label="开票单位" prop="invCorpCnName">
+                                    <search-query :datalist="invCorpData"
+                                                  :selectValue="form.invCorpCnName"
+                                                  :clearable="true"
+                                                  :disabled="editSave"
+                                                  :buttonIf="false"
+                                                  :remote="true"
+                                                  :filterable="true"
+                                                  placeholder="请选择开票单位"
+                                                  :forParameter="{ key:'id', label:'cnName', value:'cnName'}"
+                                                  @corpChange="corpChange($event,'invCorpCnName')"
+                                                  @remoteMethod="invCorpBcorpsListfun"
+                                                  @corpFocus="invCorpBcorpsListfun" >
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="美元银行" prop="invCorpAccountBankUsd">
+                                    <el-input style="width: 100%;" v-model="form.invCorpAccountBankUsd"
+                                              size="small" autocomplete="off"
+                                              :disabled="true"
+                                              clearable placeholder="请输入美元银行" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="美元账户" prop="invCorpAccountNoUsd">
+                                    <search-query :datalist="invCorpAccountUSDData"
+                                                  :selectValue="form.invCorpAccountNoUsd"
+                                                  :clearable="true"
+                                                  :disabled="editSave || !form.invCorpId"
+                                                  :buttonIf="false"
+                                                  :remote="true"
+                                                  :filterable="true"
+                                                  placeholder="请输入美元账户"
+                                                  :forParameter="{ key:'id', label:'accountNo', value:'accountNo'}"
+                                                  @corpChange="corpChange($event,'invCorpAccountNoUsd')"
+                                                  @remoteMethod="invCorpAccountBankUsdListfun">
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="人民币银行" prop="invCorpAccountBankCny">
+                                    <el-input style="width: 100%;" v-model="form.invCorpAccountBankCny"
+                                              size="small" autocomplete="off"
+                                              :disabled="true"
+                                              clearable placeholder="请输入美元银行" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="人民币账户" prop="invCorpAccountNoCny">
+                                    <search-query :datalist="invCorpAccountCNYData"
+                                                  :selectValue="form.invCorpAccountNoCny"
+                                                  :clearable="true"
+                                                  :disabled="editSave || !form.invCorpId"
+                                                  :buttonIf="false"
+                                                  :remote="true"
+                                                  :filterable="true"
+                                                  placeholder="请输入人民币账户"
+                                                  :forParameter="{ key:'id', label:'accountNo', value:'accountNo'}"
+                                                  @corpChange="corpChange($event,'invCorpAccountNoCny')"
+                                                  @remoteMethod="invCorpAccountBankCnyListfun">
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="船名/航次" prop="vesselVoyno">
+                                    <el-input style="width: 100%;" v-model="form.vesselVoyno"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入船名/航次" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="开航日期" prop="etd">
+                                    <el-date-picker v-model="form.etd" clearable
+                                                    style="width: 100%;"
+                                                    type="date" size="small"
+                                                    :disabled="editSave"
+                                                    value-format="yyyy-MM-dd HH:mm:ss"
+                                                    placeholder="请输入开航日期">
+                                    </el-date-picker>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="装货港" prop="pol">
+                                    <search-query :datalist="polData"
+                                                  :selectValue="form.pol"
+                                                  :filterable="true"
+                                                  :clearable="true"
+                                                  :remote="true"
+                                                  :disabled="editSave"
+                                                  :buttonIf="false"
+                                                  placeholder="请输入装货港"
+                                                  :forParameter="{key:'id',label:'enName',value:'enName'}"
+                                                  @corpChange="corpChange($event,'pol')"
+                                                  @remoteMethod="polBportsListfun"
+                                                  @corpFocus="polBportsListfun" >
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="卸货港" prop="pod">
+                                    <search-query :datalist="podData"
+                                                  :selectValue="form.pod"
+                                                  :filterable="true"
+                                                  :clearable="true"
+                                                  :remote="true"
+                                                  :disabled="editSave"
+                                                  :buttonIf="false"
+                                                  placeholder="请输入卸货港"
+                                                  :forParameter="{key:'id',label:'enName',value:'enName'}"
+                                                  @corpChange="corpChange($event,'pod')"
+                                                  @remoteMethod="podBportsListfun"
+                                                  @corpFocus="podBportsListfun" >
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="目的地" prop="destination">
+                                    <search-query :datalist="destinationData"
+                                                  :selectValue="form.destination"
+                                                  :filterable="true"
+                                                  :clearable="true"
+                                                  :remote="true"
+                                                  :disabled="editSave"
+                                                  :buttonIf="false"
+                                                  placeholder="请输入目的地"
+                                                  :forParameter="{key:'id',label:'enName',value:'enName'}"
+                                                  @corpChange="corpChange($event,'destination')"
+                                                  @remoteMethod="destinationBportsListfun"
+                                                  @corpFocus="destinationBportsListfun" >
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="12">
+                                <el-form-item label="箱型箱量" prop="containers">
+                                    <el-input style="width: 100%;" v-model="form.containers"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入箱型箱量" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </div>
+                    <div class="cardBox flexBoxRight">
+                        <el-row>
+                            <el-col :span="4">
+                                <el-switch
+                                    v-model="form.stlMode"
+                                    active-value="1"
+                                    inactive-value="0"
+                                    active-color="#66dd7a"
+                                    inactive-color="#4ea6ea"
+                                    active-text="票结"
+                                    inactive-text="月结">
+                                </el-switch>
+                            </el-col>
+                            <el-col :span="6">
+                                <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"
+                                             :disabled="editSave"
+                                             v-model="form.isDk">整票(不列费用明细)
+                                </el-checkbox>
+                            </el-col>
+                            <el-col :span="5">
+                                <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"
+                                             :disabled="editSave"
+                                             v-model="form.isRp">只提取开票费用
+                                </el-checkbox>
+                            </el-col>
+                            <el-col :span="3">
+                                <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"
+                                             :disabled="editSave"
+                                             v-model="form.isExportMblno">主单号
+                                </el-checkbox>
+                            </el-col>
+                            <el-col :span="3">
+                                <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"
+                                             :disabled="editSave"
+                                             v-model="form.isExportVslvoy">船名航次
+                                </el-checkbox>
+                            </el-col>
+                            <el-col :span="3">
+                                <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"
+                                             :disabled="editSave"
+                                             v-model="form.isExportHblno">分单号
+                                </el-checkbox>
+                            </el-col>
+                        </el-row>
+                        <el-row>
+                            <el-col :span="8">
+                                <el-form-item label="结算单位" prop="corpCnName">
+                                    <search-query :datalist="corpData"
+                                                  :selectValue="form.corpCnName"
+                                                  :clearable="true"
+                                                  :disabled="editSave"
+                                                  :buttonIf="false"
+                                                  :remote="true"
+                                                  :filterable="true"
+                                                  placeholder="请输入结算单位"
+                                                  :forParameter="{ key:'id', label:'cnName', value:'cnName'}"
+                                                  @corpChange="corpChange($event,'corpCnName')"
+                                                  @remoteMethod="corpBcorpsListfun"
+                                                  @corpFocus="corpBcorpsListfun" >
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="开票日期" prop="invoiceDate">
+                                    <el-date-picker v-model="form.invoiceDate" clearable
+                                                    style="width: 100%;"
+                                                    type="date" size="small"
+                                                    :disabled="editSave"
+                                                    value-format="yyyy-MM-dd HH:mm:ss"
+                                                    placeholder="选择开票日期">
+                                    </el-date-picker>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="税控发票号" prop="taxInvoiceNo">
+                                    <el-input style="width: 100%;" v-model="form.taxInvoiceNo"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入税控发票号" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="银行账号" prop="bankReceiptAccountNo">
+                                    <search-query :datalist="bankReceiptData"
+                                                  :selectValue="form.bankReceiptAccountNo"
+                                                  :clearable="true"
+                                                  :disabled="editSave || !form.corpId"
+                                                  :buttonIf="false"
+                                                  :remote="true"
+                                                  :filterable="true"
+                                                  placeholder="请输入银行账号"
+                                                  :forParameter="{ key:'id', label:'accountNo', value:'accountNo'}"
+                                                  @corpChange="corpChange($event,'bankReceiptAccountNo')"
+                                                  @remoteMethod="bcorpsbankListfun">
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="银行名称" prop="bankReceiptBankName">
+                                    <el-input style="width: 100%;" v-model="form.bankReceiptBankName"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入银行名称" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="导出时间" prop="exportDate">
+                                    <el-date-picker v-model="form.exportDate" clearable
+                                                    style="width: 100%;"
+                                                    type="date" size="small"
+                                                    :disabled="editSave"
+                                                    value-format="yyyy-MM-dd HH:mm"
+                                                    placeholder="请选择导出时间">
+                                    </el-date-picker>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="16">
+                                <el-form-item label="业务编号" prop="businessNo">
+                                    <el-input style="width: 100%;" v-model="form.businessNo"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入业务编号" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="导出人" prop="exportName">
+                                    <el-input style="width: 100%;" v-model="form.exportName"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入导出人" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="16">
+                                <el-form-item label="主单编号" prop="mblno">
+                                    <el-input style="width: 100%;" v-model="form.mblno"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入主单编号" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="导出汇率" prop="exrate">
+                                    <el-input style="width: 100%;" v-model="form.exrate"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入导出汇率" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="16">
+                                <el-form-item label="分单编号" prop="hblno">
+                                    <el-input style="width: 100%;" v-model="form.hblno"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入分单编号" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="发票类型" prop="invType">
+                                    <search-query :datalist="invTypeData"
+                                                  :selectValue="form.invType"
+                                                  :clearable="true"
+                                                  :disabled="editSave"
+                                                  :buttonIf="false"
+                                                  placeholder="请输入发票类型"
+                                                  :forParameter="{ key:'dictKey', label:'dictValue', value:'dictKey'}"
+                                                  @corpChange="corpChange($event,'isInvoice')"
+                                                  @corpFocus="invTypeWorkDictsfun" >
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="无字段账单号" prop="bookingNo">
+                                    <el-input style="width: 100%;" v-model="form.bookingNo"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入账单号" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="对账单号" prop="checkNo">
+                                    <el-input style="width: 100%;" v-model="form.checkNo"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入对账单号" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="所属税种" prop="taxType">
+                                    <el-input style="width: 100%;" v-model="form.taxType"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入所属税种" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="BOOK NO" prop="bookingNo">
+                                    <el-input style="width: 100%;" v-model="form.bookingNo"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入BOOK NO" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="业务类型" prop="businessTypes">
+                                    <search-query :datalist="businessTypesData"
+                                                  :selectValue="form.businessTypes"
+                                                  :clearable="true"
+                                                  :disabled="editSave"
+                                                  :buttonIf="false"
+                                                  :multiple="true"
+                                                  :collapseTags="true"
+                                                  placeholder="请输入业务类型"
+                                                  @corpChange="corpChange($event,'businessTypes')">
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="税率" prop="taxRate">
+                                    <el-input style="width: 100%;" v-model="form.taxRate"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入税率" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="选择币种" prop="curCode">
+                                    <search-query :datalist="curData"
+                                                  :selectValue="form.curCode"
+                                                  :filterable="true"
+                                                  :clearable="true"
+                                                  :disabled="editSave"
+                                                  :remote="true"
+                                                  :buttonIf="false"
+                                                  placeholder="请输入选择币种"
+                                                  :forParameter="{key:'id',label:'code',value:'code'}"
+                                                  @remoteMethod="getRateListfun"
+                                                  @corpChange="corpChange($event,'curCode')"
+                                                  @corpFocus="getRateListfun">
+                                    </search-query>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"
+                                             :disabled="editSave"
+                                             v-model="form.isExchangeToCny">转换成人民币
+                                </el-checkbox>
+                                <el-button type="primary"
+                                           size="small"
+                                           icon="el-icon-service"
+                                           plain @click="finstlbillslistAccBillV1fun">提取费用
+                                </el-button>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="邮箱" prop="checkNo">
+                                    <el-input style="width: 100%;" v-model="form.checkNo"
+                                              size="small" autocomplete="off"
+                                              :disabled="editSave"
+                                              clearable placeholder="请输入邮箱" >
+                                    </el-input>
+                                </el-form-item>
+                            </el-col>
+
+                        </el-row>
+                    </div>
+                </div>
+
+                <el-card style="margin-top: 10px">
+                    <el-form-item label="全电发票备注:" prop="invCurCode">
+                        <el-input style="width: 100%;" v-model="form.elecRemarks"
+                                  size="small" autocomplete="off"
+                                  :disabled="editSave"
+                                  clearable placeholder="请输入全电发票备注" >
+                        </el-input>
+                    </el-form-item>
+                    <el-form-item label="开票金额合计:" prop="invCurCode">
+                        <span>¥{{form.amountLoc}}元</span>
+                    </el-form-item>
+                </el-card>
+
+                <el-card style="margin-top: 10px">
+                    <!--<div style="margin-bottom: 10px;display: flex;justify-content: space-between">-->
+                    <!--    <div>-->
+                    <!--        <el-button size="small" type="primary">新 建</el-button>-->
+                    <!--        <el-button size="small" type="danger">删 除</el-button>-->
+                    <!--    </div>-->
+                    <!--    <div>-->
+                    <!--        <el-button size="small" type="primary" plain>全部选择</el-button>-->
+                    <!--        <el-button size="small" type="primary" plain>确认费用</el-button>-->
+                    <!--    </div>-->
+                    <!--</div>-->
+                    <fininvoicesitems :tableData="tableData"
+                                      :handleSelectionData="handleSelectionData"
+                                      @handleSelectionChange="handleSelectionChange">
+                    </fininvoicesitems>
+                </el-card>
+
+            </el-form>
+        </div>
+    </div>
+</template>
+
+<script>
+import fininvoicesitems from "@/views/iosBasicData/fininvoices/assembly/fininvoicesitems.vue";
+import {getRateList} from "@/api/iosBasicData/rateManagement";
+import {finstlbillslistAccBillV1} from "@/api/iosBasicData/finstlbills";
+import {bcorpsbankList, getBcorpsList} from "@/api/iosBasicData/bcorps";
+import {bportsList} from "@/api/iosBasicData/bports";
+import SearchQuery from "@/components/iosbasic-data/searchquery.vue";
+import {
+    fininvoicesConfirmFinInvoices,
+    fininvoicesDetail,
+    fininvoicesRevokeFinInvoices,
+    fininvoicesSubmit
+} from "@/api/iosBasicData/fininvoices";
+import finstlbillsitems from "@/views/iosBasicData/finstlbills/assembly/finstlbillsitems.vue";
+import {getWorkDicts} from "@/api/system/dictbiz";
+
+export default {
+        components:{finstlbillsitems, SearchQuery, fininvoicesitems},
+        data() {
+            return {
+                pageLoading:false, // 全屏加载
+                saveLoading:false, // 按钮加载
+                form:{},
+                tableData:[], // 从表数据
+                handleSelectionData:[], // 选择的数据
+                corpData:[], // 结算单位数据
+                invCorpData:[], // 开票单位
+                bankReceiptData:[], // 结算单位银行账号数据
+                invCorpAccountCNYData:[],// 开票单位CNY银行数据
+                invCorpAccountUSDData:[], // 开票单位USD银行数据
+                // 业务类型
+                businessTypesData:[
+                    {
+                        label:'海运出口',
+                        value:'SE'
+                    },{
+                        label:'海运进口',
+                        value:'SI'
+                    }
+                ],
+                curData:[], // 币别
+                destinationData:[], // 目的港
+                podData:[], // 卸货港
+                polData:[], // 装货港
+                invCurCodeData:[], // 发票币种
+                invTypeData:[], // 发票类型
+            }
+        },
+        props:{
+            editSave:{
+                type:Boolean,
+                default:false
+            }
+        },
+        methods:{
+            fininvoicesConfirmFinInvoices,
+            // 下拉框的回调
+            corpChange(value,name){
+                // 结算单位
+                if (name == 'corpCnName') {
+                    if (!value) {
+                        this.$set(this.form,'corpId','')
+                        this.$set(this.form,'corpCnName','')
+                        this.$set(this.form,'corpEnName','')
+                        return
+                    }
+                    for(let item of this.corpData) {
+                        if (item.cnName == value) {
+                            this.$set(this.form,'corpId',item.id)
+                            this.$set(this.form,'corpCnName',item.cnName)
+                            this.$set(this.form,'corpEnName',item.enName)
+                            this.bcorpsbankListfun()
+                        }
+                    }
+                }
+                // 开票单位
+                else if (name == 'invCorpCnName') {
+                    this.$set(this.form,'invCorpAccountBankUsd','')
+                    this.$set(this.form,'invCorpAccountNoUsd','')
+                    this.$set(this.form,'invCorpAccountBankCny','')
+                    this.$set(this.form,'invCorpAccountNoCny','')
+                    if (!value) {
+                        this.$set(this.form,'invCorpId','')
+                        this.$set(this.form,'invCorpCnName','')
+                        this.$set(this.form,'invCorpEnName','')
+                        return
+                    }
+                    for(let item of this.invCorpData) {
+                        if (item.cnName == value) {
+                            this.$set(this.form,'invCorpId',item.id)
+                            this.$set(this.form,'invCorpCnName',item.cnName)
+                            this.$set(this.form,'invCorpEnName',item.enName)
+                            this.invCorpAccountBankCnyListfun()
+                            this.invCorpAccountBankUsdListfun()
+                        }
+                    }
+                }
+                // 结算单位银行账户
+                else if(name == 'bankReceiptAccountNo') {
+                    for(let item of this.bankReceiptData) {
+                        if (item.accountNo == value) {
+                            this.$set(this.form,'bankReceiptAccountNo',item.accountNo)
+                            this.$set(this.form,'bankReceiptBankName',item.accountBank)
+                        }
+                    }
+                }
+                // 开票单位的CNY银行账户
+                else if (name == 'invCorpAccountNoCny') {
+                    for (let item of this.invCorpAccountCNYData) {
+                        if (item.accountNo == value) {
+                            this.$set(this.form,'invCorpAccountBankCny',item.accountBank)
+                            this.$set(this.form,'invCorpAccountNoCny',item.accountNo)
+                        }
+                    }
+                }
+                // 开票单位的USD银行账户
+                else if (name == 'invCorpAccountNoUsd') {
+                    for (let item of this.invCorpAccountUSDData) {
+                        if (item.accountNo == value) {
+                            this.$set(this.form,'invCorpAccountBankUsd',item.accountBank)
+                            this.$set(this.form,'invCorpAccountNoUsd',item.accountNo)
+                        }
+                    }
+                }
+                else {
+                    this.$set(this.form,name,value)
+                }
+
+            },
+            // 下面表格多选
+            handleSelectionChange(arr){
+                this.handleSelectionData = arr
+            },
+            // 编辑事件
+            editHandle(){
+                this.editSave = false
+            },
+            // 保存按钮事件
+            editCustomer(){
+                // 开票单位
+                if (!this.form.corpId) {
+                    this.$message.warning('请选择开票单位');
+                    return
+                }
+                // 进项  销项
+                this.form.type = '销项'
+                this.form.billNoFormat = 'HYFP'
+                this.form.businessTypeCode = 'HYFP'
+                this.form.businessTypes = this.form.businessTypes?this.form.businessTypes.join(','):''
+                if (!this.form.id) {
+                    this.form.finInvoicesItemsList = this.handleSelectionData
+                }
+                this.saveLoading = true
+                this.fininvoicesSubmitfun(this.form)
+            },
+            // 检索
+            finstlbillslistAccBillV1fun(){
+                if (!this.form.corpId) {
+                    this.$message.warning('请选择结算单位');
+                    return
+                }
+                delete this.form.id
+                let obj = {}
+                obj.type = '3'
+                obj.corpCnName = this.form.corpId // 结算单位
+                obj.invoiceDate = this.form.invoiceDate //开票日期
+                obj.billNo = this.form.bookingNo // 账单号
+                obj.businessBillNo = this.form.billNo // 业务编号
+                obj.mblno = this.form.mblno // 主单编号
+                obj.hblno = this.form.hblno // 分单编号
+                obj.checkBillNo = this.form.checkNo // 对账单号
+                obj.bookingNo = this.form.bookingNo // 订舱号(BOOK NO)
+                obj.curCode = this.form.curCode // 币种
+                obj.businessType = this.form.businessTypes?this.form.businessTypes.join(','):'' // 业务类型
+                finstlbillslistAccBillV1(obj).then(res=>{
+                    this.tableData = res.data.data.map((item,index)=>{
+                        item.lineNo = index // 行号
+                        item.accBillId = item.id
+                        item.accBillNo = item.billNo
+                        item.accDate = item.createTime
+
+                        item.currentAmount = Number(item.amount) - Number(item.uninvoicedAmount) // 本次发票金额
+
+                        delete item.id
+                        return item
+                    })
+                })
+            },
+            // 保存接口
+            fininvoicesSubmitfun(obj){
+                fininvoicesSubmit(obj).then(res=>{
+                    this.saveLoading = false
+                    this.$message.success('操作成功');
+                    this.fininvoicesDetailfun(res.data.data.id)
+                })
+            },
+            // 详情接口
+            fininvoicesDetailfun(id){
+                this.pageLoading = true
+                fininvoicesDetail(id).then(res=>{
+                    this.form = res.data.data
+                    this.form.businessTypes = this.form.businessTypes?this.form.businessTypes.split(','):[] // 业务类型转换成数组显示
+                    this.tableData = this.form.finInvoicesItemsList
+                    this.pageLoading = false
+                })
+            },
+            // 确认发票
+            fininvoicesConfirmFinInvoicesfun(){
+                this.$confirm("确定进行对账操作?", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning"
+                }).then(res=>{
+                    this.pageLoading = true
+                    this.form.businessTypes = this.form.businessTypes?this.form.businessTypes.join(','):''
+                    fininvoicesConfirmFinInvoices(this.form).then(res=>{
+                        this.pageLoading = false
+                        this.$message.success('操作成功');
+                        this.fininvoicesDetailfun(res.data.data.id)
+                    }).catch(err=>{
+                        this.pageLoading = false
+                    })
+                })
+            },
+            // 撤销发票
+            fininvoicesRevokeFinInvoicesfun(){
+                this.$confirm("确定进行撤销对账操作?", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning"
+                }).then(res=>{
+                    this.pageLoading = true
+                    this.form.businessTypes = this.form.businessTypes?this.form.businessTypes.join(','):''
+                    fininvoicesRevokeFinInvoices(this.form).then(res=>{
+                        this.pageLoading = false
+                        this.$message.success('操作成功');
+                        this.fininvoicesDetailfun(res.data.data.id)
+                    }).catch(err=>{
+                        this.pageLoading = false
+                    })
+                })
+            },
+            //返回列表
+            backToList() {
+                this.$emit('goBack')
+            },
+            // 获取客户名称数据 往来单位数据
+            corpBcorpsListfun(cnName){
+                getBcorpsList(1,10,{cnName}).then(res=>{
+                    this.corpData = res.data.data.records
+                })
+            },
+            // 获取客户名称数据 开票单位数据
+            invCorpBcorpsListfun(cnName){
+                getBcorpsList(1,10,{cnName}).then(res=>{
+                    this.invCorpData = res.data.data.records
+                })
+            },
+            // 根据往来单位选择调用获取银行数据
+            bcorpsbankListfun(accountNo){
+                bcorpsbankList(1,10,{
+                    // curNo:this.cntyCode,
+                    pid:this.form.corpId,
+                    accountNo:accountNo
+                }).then(res=>{
+                    this.bankReceiptData = res.data.data.records
+                })
+            },
+            // 根据开票单位获取CNY银行数据
+            invCorpAccountBankUsdListfun(accountNo){
+                bcorpsbankList(1,10,{
+                    curNo:'USD',
+                    pid:this.form.invCorpId,
+                    accountNo:accountNo
+                }).then(res=>{
+                    this.invCorpAccountUSDData = res.data.data.records
+                })
+            },
+            // 根据开票单位获取CNY银行数据
+            invCorpAccountBankCnyListfun(accountNo){
+                bcorpsbankList(1,10,{
+                    curNo:'CNY',
+                    pid:this.form.invCorpId,
+                    accountNo:accountNo
+                }).then(res=>{
+                    this.invCorpAccountCNYData = res.data.data.records
+                })
+            },
+            // 获取币别数据
+            getRateListfun(cnName){
+                getRateList({current:1,size:10,cnName}).then(res=>{
+                    this.curData = res.data.data.records
+                })
+            },
+            // 获取发票币别数据
+            invCurCodeRateListfun(cnName){
+                getRateList({current:1,size:10,cnName}).then(res=>{
+                    this.invCurCodeData = res.data.data.records
+                })
+            },
+            // 目的地
+            destinationBportsListfun(enName){
+                bportsList(1,10,{enName}).then(res=>{
+                    this.destinationData = res.data.data.records
+                })
+            },
+            // 卸货港
+            podBportsListfun(enName){
+                bportsList(1,10,{enName}).then(res=>{
+                    this.podData = res.data.data.records
+                })
+            },
+            // 装货港
+            polBportsListfun(enName){
+                bportsList(1,10,{enName}).then(res=>{
+                    this.polData = res.data.data.records
+                })
+            },
+            // 发票类型字典数据
+            invTypeWorkDictsfun(){
+                getWorkDicts('inv_type_los').then(res=>{
+                    this.invTypeData = res.data.data;
+                })
+            },
+
+        },
+    }
+</script>
+
+<style scoped>
+::v-deep.el-form-item {
+    margin-bottom: 0;
+}
+.cardBox {
+    background: #fff;
+    width: 100%;
+    height: 100%;
+    padding: 20px;
+    box-sizing: border-box;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
+}
+.flexBox {
+    display: flex;
+}
+.flexBoxLeft {
+    flex: 2;
+    margin-right: 10px;
+    padding-bottom: 40px;
+}
+.flexBoxRight {
+    flex: 3;
+}
+</style>

src/views/iosBasicData/fininvoicesOutput/index.vue

@@ -0,0 +1,719 @@
+<template>
+  <div>
+      <basic-container v-if="isShow">
+          <avue-crud :option="option"
+                     :table-loading="loading"
+                     :data="data"
+                     :page.sync="page"
+                     :permission="permissionList"
+                     :before-open="beforeOpen"
+                     v-model="form"
+                     ref="crud"
+                     id="out-table"
+                     :header-cell-class-name="headerClassName"
+                     @row-update="rowUpdate"
+                     @row-save="rowSave"
+                     @row-del="rowDel"
+                     @search-change="searchChange"
+                     @search-reset="searchReset"
+                     @selection-change="selectionChange"
+                     @current-change="currentChange"
+                     @size-change="sizeChange"
+                     @refresh-change="refreshChange"
+                     @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 318)"
+                     @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 318)"
+                     @on-load="onLoad">
+              <template slot="menuLeft">
+                  <el-button type="success"
+                             size="small"
+                             icon="el-icon-plus"
+                             plain
+                             @click="newbillFun">新建发票
+                  </el-button>
+                  <el-button type="danger"
+                             size="small"
+                             icon="el-icon-delete"
+                             plain
+                             @click="handleDelete">删 除
+                  </el-button>
+              </template>
+              <template slot="menu" slot-scope="{row}">
+                  <el-button type="text"
+                             size="small"
+                             @click="editFun(row)">编辑
+                  </el-button>
+                  <el-button type="text"
+                             size="small"
+                             @click="rowDel(row)">删除
+                  </el-button>
+              </template>
+              <template slot-scope="scope" slot="billNo">
+                  <avue-text-ellipsis :text="scope.row.billNo" :height="30" use-tooltip placement="top">
+                      <small slot="more">...</small>
+                  </avue-text-ellipsis>
+              </template>
+              <template slot-scope="scope" slot="corpCnName">
+                  <avue-text-ellipsis :text="scope.row.corpCnName" :height="30" use-tooltip placement="top">
+                      <small slot="more">...</small>
+                  </avue-text-ellipsis>
+              </template>
+              <template slot-scope="scope" slot="corpEnName">
+                  <avue-text-ellipsis :text="scope.row.corpEnName" :height="30" use-tooltip placement="top">
+                      <small slot="more">...</small>
+                  </avue-text-ellipsis>
+              </template>
+              <template slot-scope="scope" slot="invCorpCnName">
+                  <avue-text-ellipsis :text="scope.row.invCorpCnName" :height="30" use-tooltip placement="top">
+                      <small slot="more">...</small>
+                  </avue-text-ellipsis>
+              </template>
+              <template slot-scope="scope" slot="invCorpEnName">
+                  <avue-text-ellipsis :text="scope.row.invCorpEnName" :height="30" use-tooltip placement="top">
+                      <small slot="more">...</small>
+                  </avue-text-ellipsis>
+              </template>
+              <template slot-scope="scope" slot="stlMode">
+                  <span>{{scope.row.stlMode?'月结':'票结'}}</span>
+              </template>
+          </avue-crud>
+      </basic-container>
+      <fininvoicesDetails ref="fininvoicesDetails" :editSave="editSave" v-if="!isShow" @goBack="goBack"></fininvoicesDetails>
+  </div>
+</template>
+
+<script>
+import {
+    fininvoicesList,
+    fininvoicesDetail,
+    fininvoicesRemove, fininvoicesSubmit
+} from "@/api/iosBasicData/fininvoices";
+import fininvoicesDetails from "@/views/iosBasicData/fininvoices/fininvoicesDetails.vue";
+  import {mapGetters} from "vuex";
+import finstlbillsDetails from "@/views/iosBasicData/finstlbills/finstlbillsDetails.vue";
+
+  export default {
+      components:{finstlbillsDetails, fininvoicesDetails},
+    data() {
+      return {
+          // 详情页面和列表切换
+          isShow:true,
+          editSave:false, // 编辑还是保存
+        form: {},
+        query: {},
+        loading: true,
+        page: {
+          pageSize: 10,
+          currentPage: 1,
+          total: 0
+        },
+        selectionList: [],
+        option:{},
+        optionBack: {
+          height:'auto',
+          calcHeight: 30,
+          tip: false,
+          searchShow: true,
+          searchMenuSpan: 6,
+          border: true,
+          index: true,
+          viewBtn: true,
+          selection: true,
+          dialogClickModal: false,
+            menuWidth:100,
+          column: [
+            {
+              label: "单据编号",
+              prop: "billNo",
+              rules: [{
+                required: true,
+                message: "请输入单据编号",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "单据日期",
+              prop: "billDate",
+              rules: [{
+                required: true,
+                message: "请输入单据日期",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "发票号码",
+              prop: "invoiceNo",
+              rules: [{
+                required: true,
+                message: "请输入发票号码",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "开票日期",
+              prop: "invoiceDate",
+              rules: [{
+                required: true,
+                message: "请输入开票日期",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "原发票号码",
+              prop: "origInvoiceNo",
+                width:"120"
+            },
+            {
+              label: "税务发票号码",
+              prop: "taxInvoiceNo",
+                width:"150"
+            },
+            {
+              label: "全电发票",
+              prop: "invType",
+            },
+            {
+              label: "普通发票/专用发票",
+              prop: "taxType",
+                width:"160"
+            },
+            {
+              label: "税率 %",
+              prop: "taxRate",
+              rules: [{
+                required: true,
+                message: "请输入税率 %",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "结算方式",
+              prop: "stlMode",
+            },
+            {
+              label: "发票币种",
+              prop: "invCurCode",
+              rules: [{
+                required: true,
+                message: "请输入发票币种",
+                trigger: "blur"
+              }]
+            },
+            {
+              label: "客户中文名称",
+              prop: "corpCnName",
+                width:"120"
+            },
+            {
+              label: "客户英文名称",
+              prop: "corpEnName",
+                width:"120"
+            },
+            {
+              label: "客户开票单位名称",
+              prop: "corpInvoiceHeader",
+                width:"150"
+            },
+            {
+              label: "开票单位中文名称",
+              prop: "invCorpCnName",
+                width:"160"
+            },
+            {
+              label: "开票单位英文名称",
+              prop: "invCorpEnName",
+                width:"150"
+            },
+            {
+              label: "开票单位税号",
+              prop: "invCorpTaxNo",
+                width:"140"
+            },
+            {
+              label: "开票单位CNY开户银行",
+              prop: "invCorpAccountBankCny",
+                width:"160"
+            },
+            {
+              label: "开票单位CNY银行账号",
+              prop: "invCorpAccountNoCny",
+                width:"160"
+            },
+            {
+              label: "开票单位USD开户银行",
+              prop: "invCorpAccountBankUsd",
+                width:"160"
+            },
+            {
+              label: "开票单位USD银行账号",
+              prop: "invCorpAccountNoUsd",
+                width:"160"
+            },
+            {
+              label: "船名/航次",
+              prop: "vesselVoyno",
+                width:"100"
+            },
+            {
+              label: "开船日",
+              prop: "etd",
+            },
+            {
+              label: "装货港",
+              prop: "pol",
+            },
+            {
+              label: "卸货港",
+              prop: "pod",
+            },
+            {
+              label: "目的地",
+              prop: "destination",
+            },
+            {
+              label: "箱型/箱量",
+              prop: "containers",
+                width:"100"
+            },
+            {
+              label: "币种",
+              prop: "curCode",
+            },
+            {
+              label: "原汇率",
+              prop: "exrate",
+            },
+            {
+              label: "是否转换为人民币",
+              prop: "isExchangeToCny",
+                width:"140",
+                dicData:[{
+                    label:'否',
+                    value:0
+                },{
+                    label:'是',
+                    value:1
+                },]
+            },
+            {
+              label: "业务类型",
+              prop: "businessTypes",
+            },
+            {
+              label: "业务单据编号",
+              prop: "businessNo",
+                width:"120",
+            },
+            {
+              label: "对账单编号",
+              prop: "checkNo",
+                width:"120",
+            },
+            {
+              label: "MBL NO",
+              prop: "mblno",
+            },
+            {
+              label: "HBL NO",
+              prop: "hblno",
+            },
+            {
+              label: "订舱",
+              prop: "bookingNo",
+            },
+            {
+              label: "中文船名",
+              prop: "vesselCnName",
+            },
+            {
+              label: "英文船名",
+              prop: "vesselEnName",
+            },
+            {
+              label: "航次",
+              prop: "voyageNo",
+            },
+            {
+              label: "财务开始日期",
+              prop: "accountDateFrom",
+                width:"100",
+            },
+            {
+              label: "财务结束日期",
+              prop: "accountDateTo",
+                width:"100",
+            },
+            {
+              label: "申请人",
+              prop: "applicantName",
+            },
+            {
+              label: "审核人",
+              prop: "approverName",
+            },
+            {
+              label: "是否代理发票",
+              prop: "isAgent",
+                width:"120",
+                dicData:[{
+                    label:'否',
+                    value:0
+                },{
+                    label:'是',
+                    value:1
+                },]
+            },
+            {
+              label: "是否DK",
+              prop: "isDk",
+                dicData:[{
+                    label:'否',
+                    value:0
+                },{
+                    label:'是',
+                    value:1
+                },]
+            },
+            {
+              label: "是否RP",
+              prop: "isRp",
+                dicData:[{
+                    label:'否',
+                    value:0
+                },{
+                    label:'是',
+                    value:1
+                },]
+            },
+            {
+              label: "RP名称",
+              prop: "rpName",
+            },
+            {
+              label: "导出日期",
+              prop: "exportDate",
+              width: "100"
+            },
+            {
+              label: "导出人",
+              prop: "exportName",
+            },
+            {
+              label: "是否导出船名航次",
+              prop: "isExportVslvoy",
+                width: "140",
+                dicData:[{
+                    label:'否',
+                    value:0
+                },{
+                    label:'是',
+                    value:1
+                },]
+            },
+            {
+              label: "是否导出主单号",
+              prop: "isExportMblno",
+                width: "140",
+                dicData:[{
+                    label:'否',
+                    value:0
+                },{
+                    label:'是',
+                    value:1
+                },]
+            },
+            {
+              label: "是否导出分单号",
+              prop: "isExportHblno",
+                width: "140",
+                dicData:[{
+                    label:'否',
+                    value:0
+                },{
+                    label:'是',
+                    value:1
+                },]
+            },
+            {
+              label: "发票本位币(CNY)",
+              prop: "amountCny",
+                width: "140",
+            },
+            {
+              label: "发票USD",
+              prop: "amountUsd",
+              width: "100"
+            },
+            {
+              label: "税额(CNY)",
+              prop: "amountTax",
+                width: "100"
+            },
+            {
+              label: "合计本位币(CNY)",
+              prop: "amountLoc",
+                width: "120"
+            },
+            {
+              label: "全电发票备注",
+              prop: "elecRemarks",
+                width: "120"
+            },
+            {
+              label: "银行进账单出票人名称",
+              prop: "bankReceiptCorpName",
+                width: "160"
+            },
+            {
+              label: "银行进账单出票银行",
+              prop: "bankReceiptBankName",
+                width: "160"
+            },
+            {
+              label: "银行进账单出票银行账号",
+              prop: "bankReceiptAccountNo",
+                width: "160"
+            },
+            {
+              label: "银行进账单票据种类",
+              prop: "bankReceiptBillType",
+                width: "160"
+            },
+            {
+              label: "银行进账单票据张数",
+              prop: "bankReceiptBillCount",
+                width: "160"
+            },
+            {
+              label: "银行进账单是否已进账(收款)",
+              prop: "bankReceiptIsIncome",
+                width: "180"
+            },
+            {
+              label: "备注",
+              prop: "remarks",
+              rules: [{
+                required: true,
+                message: "请输入备注",
+                trigger: "blur"
+              }]
+            },
+          ]
+        },
+        data: []
+      };
+    },
+      watch:{
+
+      },
+    computed: {
+      ...mapGetters(["permission"]),
+      permissionList() {
+        return {
+          addBtn: this.vaildData(this.permission.fininvoices_add, false),
+          viewBtn: this.vaildData(this.permission.fininvoices_view, false),
+          delBtn: this.vaildData(this.permission.fininvoices_delete, false),
+          editBtn: this.vaildData(this.permission.fininvoices_edit, false)
+        };
+      },
+      ids() {
+        let ids = [];
+        this.selectionList.forEach(ele => {
+          ids.push(ele.id);
+        });
+        return ids.join(",");
+      }
+    },
+      async created() {
+          this.option = await this.getColumnData(this.getColumnName(318), this.optionBack);
+      },
+    methods: {
+        // 新建发票
+      newbillFun(){
+          this.isShow = false;
+      },
+        // 编辑
+        editFun(row) {
+            this.isShow = false
+            this.editSave = true
+            this.$nextTick(()=>{
+                this.$refs.fininvoicesDetails.fininvoicesDetailfun(row.id)
+            })
+        },
+        // 详情的返回列表
+        goBack() {
+            // 初始化数据
+            // this.detailData = this.$options.data().detailData;
+            if (JSON.stringify(this.$route.query) != "{}") {
+                this.$router.$avueRouter.closeTag();
+                this.$router.push({
+                    path: "/iosBasicData/fininvoices/index"
+                });
+            }
+            this.isShow = true;
+            this.onLoad(this.page, this.search);
+        },
+
+
+      rowSave(row, done, loading) {
+        fininvoicesSubmit(row).then(() => {
+          this.onLoad(this.page);
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+          done();
+        }, error => {
+          loading();
+          window.console.log(error);
+        });
+      },
+      rowUpdate(row, index, done, loading) {
+        fininvoicesSubmit(row).then(() => {
+          this.onLoad(this.page);
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+          done();
+        }, error => {
+          loading();
+          console.log(error);
+        });
+      },
+      rowDel(row) {
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        })
+          .then(() => {
+            return fininvoicesRemove(row.id);
+          })
+          .then(() => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!"
+            });
+          });
+      },
+      handleDelete() {
+        if (this.selectionList.length === 0) {
+          this.$message.warning("请选择至少一条数据");
+          return;
+        }
+        this.$confirm("确定将选择数据删除?", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        })
+          .then(() => {
+            return fininvoicesRemove(this.ids);
+          })
+          .then(() => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!"
+            });
+            this.$refs.crud.toggleSelection();
+          });
+      },
+      beforeOpen(done, type) {
+        if (["edit", "view"].includes(type)) {
+          fininvoicesDetail(this.form.id).then(res => {
+            this.form = res.data.data;
+          });
+        }
+        done();
+      },
+      searchReset() {
+        this.query = {};
+        this.onLoad(this.page);
+      },
+      searchChange(params, done) {
+        this.query = params;
+        this.page.currentPage = 1;
+        this.onLoad(this.page, params);
+        done();
+      },
+      selectionChange(list) {
+        this.selectionList = list;
+      },
+      selectionClear() {
+        this.selectionList = [];
+        this.$refs.crud.toggleSelection();
+      },
+      currentChange(currentPage){
+        this.page.currentPage = currentPage;
+      },
+      sizeChange(pageSize){
+        this.page.pageSize = pageSize;
+      },
+      refreshChange() {
+        this.onLoad(this.page, this.query);
+      },
+      onLoad(page, params = {}) {
+        this.loading = true;
+        fininvoicesList(page.currentPage, page.pageSize, {...Object.assign(params, this.query),type:"销项"}).then(res => {
+          const data = res.data.data;
+          this.page.total = data.total;
+          this.data = data.records;
+          this.loading = false;
+          this.selectionClear();
+        });
+      },
+
+        //自定义列保存
+        async saveColumnTwo(ref, option, optionBack, code) {
+            /**
+             * 已定义全局方法，直接使用，saveColumnData保存列数据方法,参数传值(表格名称，当前表格的option数据)
+             * 已定义全局方法，直接使用，getColumnName方法用来获取枚举值，参数根据自己定义的code值获取中文名
+             * 一定要执行异步操作，要等接口成功返回，才能执行下一行代码
+             */
+            const inSave = await this.saveColumnData(this.getColumnName(code), this[option]);
+            if (inSave) {
+                this.$message.success("保存成功");
+                //关闭窗口
+                this.$refs[ref].$refs.dialogColumn.columnBox = false;
+            }
+        },
+        //自定义列重置
+        async resetColumnTwo(ref, option, optionBack, code) {
+            this[option] = this[optionBack];
+            const inSave = await this.delColumnData(this.getColumnName(code), this[optionBack]);
+            if (inSave) {
+                this.$message.success("重置成功");
+                this.$refs[ref].$refs.dialogColumn.columnBox = false;
+            }
+        },
+
+        // 更改表格颜色
+        headerClassName(tab) {
+            //颜色间隔
+            let back = ""
+            if (tab.columnIndex >= 0 && tab.column.level === 1) {
+                if (tab.columnIndex % 2 === 0) {
+                    back = "back-one"
+                } else if (tab.columnIndex % 2 === 1) {
+                    back = "back-two"
+                }
+            }
+            return back;
+        },
+
+    }
+  };
+</script>
+
+<style scoped>
+::v-deep#out-table .back-one {
+    background: #ecf5ff !important;
+    text-align: center;
+}
+
+::v-deep#out-table .back-two {
+    background: #ecf5ff !important;
+    text-align: center;
+}
+</style>