Handlepan.vue

<template>
  <div class="eibs-tab">
    <!-- ====================顶部==================== -->
    <c-col :span="24" style="height: 25px">
      <el-divider></el-divider>
    </c-col>
    <!-- 正常发票表格 -->
    <c-col :span="24" style="height: 24px">
      <el-form-item class="formItemLabel" label="正常发票:" label-width="72px">
      </el-form-item>
    </c-col>
    <c-col :span="24">
      <c-table style="text-align: center" highlight-current-row @row-click="handleInvrepRowClick" :row-class-name="tableInvrepRowClassName" :list="model.invchk.invrep.zcinvlst" :paginationShow="true" :border="true" :total="model.invchk.invrep.zcinvlst.length">
        <el-table-column label="替换" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.repflg'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票代码" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.invoicecode'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票号码" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.invoicenumber'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票监控状态" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.monstatus'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理状态" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.hantyp'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理时间" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.handat'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理用户" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.hanusr'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="开票日期" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.billingdate'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票占用金额" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.amountin'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="价税合计" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.amounttax'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="" prop="det" width="150px" fixed="right">
          <template slot-scope="scope" slot="header">
            <c-button circle style="padding: 4px" class="el-icon-plus" size="mini" @click="addRowZcinvlst(scope)">
            </c-button>
            <c-button style="padding: 4px" circle class="el-icon-minus" size="mini" @click="removeRowZcinvlst(scope)">
            </c-button>
          </template>
          <template slot-scope="scoped">
            <c-button style="margin-left: 0" size="small" type="primary" icon="el-icon-info" @click="detailForeignDialog(scoped.$index, scoped.row)"></c-button>
          </template>
        </el-table-column>
      </c-table>
    </c-col>
    <!-- S0000211 : 正常发票 -->
    <!-- S0000220 : 替换 -->
    <c-col :span="24">
      <el-form-item label="替换" label-width="50px">
        <c-button size="small" type="primary">全选</c-button>
        <c-button size="small" type="primary">清空</c-button>
      </el-form-item>
    </c-col>

    <!-- 异常发票表格 -->
    <c-col :span="24" style="height: 24px">
      <el-form-item class="formItemLabel" label="异常发票:" label-width="72px">
      </el-form-item>
    </c-col>
    <c-col :span="24">
      <c-table style="text-align: center" highlight-current-row @row-click="handleInvrepRowClick" :row-class-name="tableInvrepRowClassName" :list="model.invchk.invrep.zcinvlst" :paginationShow="true" :border="true" :total="model.invchk.invrep.zcinvlst.length">
        <el-table-column label="替换" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.repflg'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="忽略" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.ignflg'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票代码" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.invoicecode'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票号码" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.invoicenumber'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票监控状态" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.monstatus'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理状态" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.hantyp'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理时间" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.handat'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理用户" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.hanusr'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="开票日期" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.billingdate'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票占用金额" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.amountin'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="价税合计" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.amounttax'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="" prop="det" width="150px" fixed="right">
          <template slot-scope="scope" slot="header">
            <c-button circle style="padding: 4px" class="el-icon-plus" size="mini" @click="addRowZcinvlst(scope)">
            </c-button>
            <c-button style="padding: 4px" circle class="el-icon-minus" size="mini" @click="removeRowZcinvlst(scope)">
            </c-button>
          </template>
          <template slot-scope="scoped">
            <c-button style="margin-left: 0" size="small" type="primary" icon="el-icon-info" @click="detailForeignDialog(scoped.$index, scoped.row)"></c-button>
          </template>
        </el-table-column>
      </c-table>
    </c-col>
    <!-- S0000212 : 异常发票 -->
    <!-- S0000225 : 替换 -->
    <c-col :span="24">
      <el-form-item label="替换" label-width="50px">
        <c-button size="small" type="primary">全选</c-button>
        <c-button size="small" type="primary">清空</c-button>
      </el-form-item>
    </c-col>
    <!-- S0000226 : 忽略 -->
    <c-col :span="24">
      <el-form-item label="忽略" label-width="50px">
        <c-button size="small" type="primary">全选</c-button>
        <c-button size="small" type="primary">清空</c-button>
      </el-form-item>
    </c-col>

    <!-- 重复核验\重复监控表格 -->
    <c-col :span="24" style="height: 24px">
      <el-form-item class="formItemLabel" label="重复核验\重复监控:" label-width="130px">
      </el-form-item>
    </c-col>
    <c-col :span="24">
      <c-table style="text-align: center" highlight-current-row @row-click="handleInvrepRowClick" :row-class-name="tableInvrepRowClassName" :list="model.invchk.invrep.zcinvlst" :paginationShow="true" :border="true" :total="model.invchk.invrep.zcinvlst.length">
        <el-table-column label="替换" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.repflg'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="忽略" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.ignflg'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票代码" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.invoicecode'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票号码" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.invoicenumber'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票监控状态" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.monstatus'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理状态" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.hantyp'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理时间" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.handat'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="处理用户" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.hanusr'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="开票日期" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.billingdate'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="发票占用金额" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.amountin'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="价税合计" width="185px">
          <template slot-scope="scope">
            <el-form-item label-width="0" :prop="'invchk.invrep.zcinvlst.' + scope.$index + '.amounttax'">
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="" prop="det" width="150px" fixed="right">
          <template slot-scope="scope" slot="header">
            <c-button circle style="padding: 4px" class="el-icon-plus" size="mini" @click="addRowZcinvlst(scope)">
            </c-button>
            <c-button style="padding: 4px" circle class="el-icon-minus" size="mini" @click="removeRowZcinvlst(scope)">
            </c-button>
          </template>
          <template slot-scope="scoped">
            <c-button style="margin-left: 0" size="small" type="primary" icon="el-icon-info" @click="detailForeignDialog(scoped.$index, scoped.row)"></c-button>
          </template>
        </el-table-column>
      </c-table>
    </c-col>

    <!-- S0000213 : 重复核验\重复监控 -->
    <!-- S0000231 : 替换 -->
    <c-col :span="24">
      <el-form-item label="替换" label-width="50px">
        <c-button size="small" type="primary">全选</c-button>
        <c-button size="small" type="primary">清空</c-button>
      </el-form-item>
    </c-col>
    <!-- S0000232 : 忽略 -->
    <c-col :span="24">
      <el-form-item label="忽略" label-width="50px">
        <c-button size="small" type="primary">全选</c-button>
        <c-button size="small" type="primary">清空</c-button>
      </el-form-item>
    </c-col>
    <!-- S0000214 : 被替换发票占用总金额 -->
    <c-col :span="12">
      <el-form-item label="被替换发票占用总金额" prop="invchk.invrep.totalamountin">
        <c-input v-model="model.invchk.invrep.totalamountin" placeholder=""></c-input>
      </el-form-item>
    </c-col>

  </div>
</template>
<script>
import Event from "../event";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [Event],
  data() {
    return {
      currentZcinvlstIndex: -1
    };
  },
  methods: {
    //第一个表格
    addRowZcinvlst(row) {
      let newRow = {
        repflg: "",
        invoicecode: "",
        invoicenumber: "",
        monstatus: "",
        hantyp: "",
        handat: ""
      };
      let start = 0;
      if (this.model.invchk.invrep.zcinvlst) {
        start = this.model.invchk.invrep.zcinvlst.length;
      }
      this.model.invchk.invrep.zcinvlst.splice(start, 0, newRow);
    },
    removeRowZcinvlst() {
      console.log("选中的他行下标", this.currentZcinvlstIndex);
      if (this.currentZcinvlstIndex === -1) {
        this.$notify.error({
          title: "错误",
          message: "请选择一条数据删除!"
        });
        return;
      }
      this.model.invchk.invrep.zcinvlst.splice(this.currentZcinvlstIndex, 1);
      this.currentZcinvlstIndex = -1;
      //this.processSetpan();
    },
    tableInvrepRowClassName({ row, rowIndex }) {
      row.index = rowIndex;
    },
    handleInvrepRowClick(row) {
      this.currentZcinvlstIndex = row.index;
    }
  },
  created: function() {}
};
</script>
<style>
</style>