<template>
  <div>
    <div class="d-flex flex-between">
      <div>
        <el-button type="primary" size="medium" @click="addData">
          <span class="d-in-block v-mid el-icon-plus font-size-16"></span>
          <span class="d-in-block v-mid font-size-16">新建报表</span>
        </el-button>
        <el-button type="primary" size="medium" @click="exportAll" :disabled="multipleSelection.length == 0">
          <span class="d-in-block v-mid font-size-16">导出</span>
        </el-button>
        <el-button type="danger" size="medium" @click="batchDel" :disabled="multipleSelection.length == 0">
          <span class="d-in-block v-mid font-size-16">删除</span>
        </el-button>
      </div>
      <el-form label-width="100px" :inline="true">
        <el-form-item prop="filteTime">
          <el-date-picker style="width: 100%" v-model="filteTime" type="year" value-format="yyyy" placeholder="请选择时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item prop="keyword">
          <el-input placeholder="请输入搜索关键字" v-model="keyword" clearable @clear="getListData" v-if="activeName == 'first'">
          </el-input>
          <el-input placeholder="请输入搜索关键字" v-model="keyword" clearable @clear="getListData_hzb" v-else>
          </el-input>
        </el-form-item>
        <el-button type="primary" class="ml5" @click="getListData" v-if="activeName == 'first'">搜索</el-button>
        <el-button type="primary" class="ml5" @click="getListData_hzb" v-else>搜索</el-button>
      </el-form>
    </div>

    <el-tabs v-model="activeName" @tab-click="handleTab">
      <el-tab-pane label="公示表" name="first">
        <el-table :data="applyTable"  tooltip-effect="dark" v-loading="loading" style="width: 100%" @selection-change="handleSelectionChange">
          <el-table-column type="selection" align="center" width="55"></el-table-column>
          <el-table-column label="序号" align="center" type="index" width="50"></el-table-column>
          <el-table-column label="报表名称" prop="gsb_bbmc" show-overflow-tooltip></el-table-column>
          <el-table-column label="年份" prop="gsb_nf" show-overflow-tooltip></el-table-column>
          <el-table-column label="员工姓名" prop="gsb_ygxm" show-overflow-tooltip></el-table-column>
          <el-table-column label="创建人" prop="gsb_cjr" show-overflow-tooltip></el-table-column>
          <el-table-column label="创建时间" prop="create_dateline" show-overflow-tooltip></el-table-column>
          <el-table-column label="操作" width="150">
            <template slot-scope="scope">
              <el-button type="text" @click="toDetail(scope.row)">详情
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <footer class="flex-item-none" style="display: flex; justify-content: flex-end; margin-top: 30px">
        <el-pagination background layout="total,prev, pager, next" :page-size="limit" :total="total"
          :current-page.sync="cur_page" @current-change="handleCurrentChange"></el-pagination>
      </footer>
      </el-tab-pane>

     
        <el-tab-pane label="汇总表" name="second">
          <el-table :data="auditTable" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
            <el-table-column type="selection" align="center" width="55"></el-table-column>
            <el-table-column label="序号" align="center" type="index" width="50"></el-table-column>
            <el-table-column label="报表名称" show-overflow-tooltip prop="hzb_bbmc" width="auto"></el-table-column>
            <el-table-column label="年份"  prop="hzb_nf" ></el-table-column>
            <el-table-column label="员工姓名" prop="hzb_ygxm" ></el-table-column>
            <el-table-column label="创建人" prop="hzb_cjr" ></el-table-column>
            <el-table-column label="创建时间" prop="create_dateline"></el-table-column>
            <el-table-column label="操作" width="150">
              <template slot-scope="scope">
                <el-button type="text" @click="toDetail(scope.row)">详情</el-button>
              </template>
            </el-table-column>
          </el-table>
          <footer class="flex-item-none" style="display: flex; justify-content: flex-end; margin-top: 30px">
          <el-pagination background layout="total,prev, pager, next" :page-size="limit_hzb" :total="total_hzb"
            :current-page.sync="cur_page_hzb" @current-change="handleCurrentChange_hzb"></el-pagination>
        </footer>
        </el-tab-pane>
      
    </el-tabs>
   

    <!-- dialog 公示表-弹出 -->
    <el-dialog :title="title" :visible.sync="dialogFormVisible" width="600px" 
    v-loading="dialogLoading"
    element-loading-text="图表生成中...,请稍等~"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)">
      <el-form :model="dialogForm" ref="gsb_addForm" :rules="rules_gsb" label-width="90px" label-position="left">
        <el-form-item label="报表名称" prop="bbmc">
          <el-input v-model="dialogForm.bbmc"></el-input>
        </el-form-item>
        <el-form-item label="年份" prop="nf">
          <el-date-picker v-model="dialogForm.nf" type="year" value-format="yyyy" placeholder="请选择年份"></el-date-picker>
        </el-form-item>
        <el-form-item label="员工姓名" prop="ygxmArr">
          <el-select style="width: 100%" multiple v-model="dialogForm.ygxmArr" placeholder="默认本人（支持多选）" @change="handleMultiSelect" filterable value-key="label">
            <el-option v-for="item in USERList" :key="item.value" :label="item.label"
              :value="item">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="addFormSubmit('gsb_addForm')">确 定</el-button>
      </div>
    </el-dialog>

    <!-- didlog 公示表——报表显示 -->
    <el-dialog
      :title="title"
      :visible.sync="dialogVisible_formS1" width="70%">
      <div style="min-height:400px;">
        <div>
          <table id="tb1" border="1" cellspacing="0" cellpadding="0" width="100%;">
            <caption class="formTitle">机关事业单位工作人员加班情况公示表</caption>
            <thead>
              <tr class="tabHeadOne">
                <th>单位（公章）：</th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
              </tr>
              <tr class="tabHeadOne">
                <th>序号</th>
                <th>姓名</td>
                <th>所在科室</td>
                <th>加班事由</th>
                <th>加班地点</th>
                <th>加班开始时间</th>
                <th>加班结束时间</th>
                <th>连续加班小时数</th>
                <th>夜餐金额</th>
                <th>备注</th>
              </tr>
            </thead>
            <tbody>
                <tr v-for="(item,index) in gsbData" :key="index" class="tabcont">
                    <td>{{item.xh}}</td>
                    <td>{{item.xm}}</td>
                    <td>{{item.szks}}</td>
                    <td>{{item.jbsy}}</td>
                    <td>{{item.jbdd}}</td>
                    <td>{{item.jbkssj}}</td>
                    <td>{{item.jbjssj}}</td>
                    <td>{{item.lxjbxss}}</td>
                    <td>{{item.ycje}}</td>
                    <td>{{item.bz}}</td>
                </tr>
            </tbody>
            <tfoot>
              <tr class="tabHeadOne">
                <th>合计</th>
                <th v-for="item in 9"></th>
              </tr>
            </tfoot>
        </table>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible_formS1 = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible_formS1 = false">确 定</el-button>
      </span>
    </el-dialog>

    <!-- dialog 汇总表弹出 -->
    <el-dialog :title="title" :visible.sync="dialogFormVisible_hzb" width="600px" 
    v-loading="dialogLoading"
    element-loading-text="图表生成中...,请稍等~"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)">
      <el-form :model="dialogForm_hzb" ref="hzb_addForm" :rules="rules_hzb" label-width="90px" label-position="left">
        <el-form-item label="报表名称" prop="bbmc">
          <el-input v-model="dialogForm_hzb.bbmc"></el-input>
        </el-form-item>
        <el-form-item label="年份" prop="nf">
          <el-date-picker v-model="dialogForm_hzb.nf" type="year" value-format="yyyy" placeholder="请选择年份"></el-date-picker>
        </el-form-item>
        <el-form-item label="员工姓名"  prop="ygxmArr">
          <el-select style="width: 100%" multiple v-model="dialogForm_hzb.ygxmArr" placeholder="默认本人（支持多选）" @change="handleMultiSelect" filterable value-key="label">
            <el-option v-for="item in USERList" :key="item.value" :label="item.label"
              :value="item">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button @click="dialogFormVisible_hzb = false">取 消</el-button>
        <el-button type="primary" @click="addFormSubmit('hzb_addForm')">确 定</el-button>
      </div>
    </el-dialog>
     <!-- didlog 汇总表——报表显示 -->
     <el-dialog
      :title="title"
      :visible.sync="dialogVisible_formS2" width="80%">
      <div style="min-height:400px;">
        <div>
          <div class="formTitle">机关事业单位工作人员加班情况公示表</div>
          <div class="everyTR">
            <div class="w60 TaL singleP">填报单位（盖章）：</div>
            <div class="w40 TaL singleP">填报时间：  年  月  日</div>  
          </div>
          <div class="everyTR" >
            <div class="TaC singleTitle" >序号</div>
            <div class="TaC singleTitle" >姓名</div>
            <div class="TaC singleTitle" >性别</div>
            <div class="TaC singleTitle" >参加工作时间</div>
            <div class="TaC singleTitle" >职务岗位</div>
            <div class="TaC singleTitle" >工作日晚上加班（日期）</div>
            <div class="TaC singleTitle" >加班小时数</div>
            <div class="TaC singleTitle" >休息日（含法定节假日）加班（日期）</div>
            <div class="TaC singleTitle" >加班小时数</div>
            <div class="TaC singleTitle" >重点项目、重大事项、加班（日期）</div>
            <div class="TaC singleTitle" >加班小时数</div>
            <div class="TaC singleTitle" >伙食补助次数</div>
            <div class="TaC singleTitle" >伙食补助金额</div>
            <div class="TaC singleTitle" >备注</div>
          </div>
          <div class="everyTR" v-for="(item,index) in hzbData" :key="index">
            <div class="TaC singleTitle" >{{item.xh}}</div>
            <div class="TaC singleTitle" >{{item.xm}}</div>
            <div class="TaC singleTitle" >{{item.xb}}</div>
            <div class="TaC singleTitle" >{{item.cjgzsj}}</div>
            <div class="TaC singleTitle" >{{item.zwgw}}</div>
            <div class="TaC singleTitle" >{{item.gzrjb}}</div>
            <div class="TaC singleTitle" >{{item.gzrjb_xss}}</div>
            <div class="TaC singleTitle" >{{item.xxrjb}}</div>
            <div class="TaC singleTitle" >{{item.xxrjb_xss}}</div>
            <div class="TaC singleTitle" >{{item.zdsxjb}}</div>
            <div class="TaC singleTitle" >{{item.zdsxjb_xss}}</div>
            <div class="TaC singleTitle" >{{item.hsbzcs}}</div>
            <div class="TaC singleTitle" >{{item.hsbzje}}</div>
            <div class="TaC singleTitle" >{{item.bz}}</div>
          </div>
          <div class="everyTR">
            <div class="TaL singleP" style="width:18%;">合计</div>
            <div class="TaC singleP" style="width:82%;"></div>  
          </div>
           <div class="everyTR">
            <div class="w50 TaL singleP">公示情况</div>
            <div class="w50 TaL singleP">以上加班情况已于    年    月    日 ——      年    月    日进行公示，经公示无异议。</div>  
          </div>
          <div class="everyTR">
            <div class="w33 TaL singleP">单位领导意见（签字）：</div>
            <div class="w33 TaL singleP">填表人（签字）：</div>  
            <div class="w33 TaL singleP">联系电话：</div> 
          </div>
          
          <!-- <table id="tb2" border="1" cellspacing="0" cellpadding="0">
            <caption class="formTitle">机关事业单位工作人员加班伙食补助审核名册汇总表</caption>
            <thead>
              <tr class="tabHeadTwo tabHeadTwoFirst_tr">
                <th>填报单位（盖章）：</th>
                <th>填报时间：  年  月  日</th>
              </tr>
              <tr class="tabHeadTwo tabHeadTwoSecond_tr">
                <th>序号</th>
                <th>姓名</th>
                <th>性别</th>
                <th>参加工作时间</th>
                <th>职务岗位</th>
                <th>工作日晚上加班（日期）</th>
                <th>加班小时数</th>
                <th>休息日（含法定节假日）加班（日期）</th>
                <th>加班小时数</th>
                <th>重点项目、重大事项、加班（日期）</th>
                <th>加班小时数</th>
                <th>伙食补助次数</th>
                <th>伙食补助金额</th>
                <th>备注</th>
              </tr>
            </thead>
            <tbody>
                <tr v-for="(item,index) in hzbData" :key="index" class="tabcontSecond">
                    <td>{{item.xh}}</td>
                    <td>{{item.xm}}</td>
                    <td>{{item.xb}}</td>
                    <td>{{item.cjgzsj}}</td>
                    <td>{{item.zwgw}}</td>
                    <td>{{item.gzrjb}}</td>
                    <td>{{item.gzrjb_xss}}</td>
                    <td>{{item.xxrjb}}</td>
                    <td>{{item.xxrjb_xss}}</td>
                    <td>{{item.zdsxjb}}</td>
                    <td>{{item.zdsxjb_xss}}</td>
                    <td>{{item.hsbzcs}}</td>
                    <td>{{item.hsbzje}}</td>
                    <td>{{item.bz}}</td>
                </tr>
            </tbody>
            <tfoot>
              <tr class="tabTfootTwo">
                <th>合计</th>
                <th v-for="item in 13"></th>
              </tr>

              <tr class="tabTfootTwo">
                <th>公示情况</th>
                <th>以上加班情况已于    年    月    日 ——      年    月    日进行公示，经公示无异议。</th>
                <th v-for="item in 12"></th>
              </tr>

              <tr class="tabTfootTwo">
                <th>单位领导意见（签字）：</th>
                <th>填表人（签字）：</th>
                 <th>联系电话：</th>
                <th v-for="item in 12"></th>
              </tr>    
              
            </tfoot>
        </table> -->
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible_formS2 = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible_formS2 = false">确 定</el-button>
      </span>
    </el-dialog>



  </div>
</template>
  
<script>
import { gsb_list, gsb_add, gsb_edit, gsb_del, gsb_detail, hzb_list, hzb_add, hzb_edit, hzb_del, hzb_detail, org_users } from "./itemApi";
import { useUserStore } from "@/stores/user";
const { real_name, user_id, dept_ids } = useUserStore();
export default {
  name: "index",

  data() {
    return {
      filteTime: "",
      keyword: "",
      activeName: "first",
      applyTable: [],
      limit: 10,
      total: 0,
      cur_page: 1,
      dialogFormVisible: false,
      dialogForm: {
        bbmc: '',
        nf: '',
        ygxmArr:'',
      },
      rules_gsb: {
        bbmc: [
          { required: true, message: '请输入报表名称', trigger: 'blur' }
        ],
        nf: [
          { required: true, message: '请选择年份', trigger: 'change' }
        ],
        ygxmArr: [
          { required: true, message: '请选择员工', trigger: 'change' }
        ],
      },
      dialogLoading:false,
      title: "",
      money: 0,
      totalMoney: 0,
      multipleSelection: [],
      curID: "",
      loading: false,
      userList: [],
      USERList:[],
      curChooseName: [],
      curChooseId: [],
      dialogVisible_formS1: false,
      dialogVisible_formS2: false,

      limit_hzb: 10,
      total_hzb: 0,
      cur_page_hzb: 1,
      auditTable: [], //审核列表
      dialogForm_hzb: {
        bbmc: '',
        nf: '',
        ygxmArr:'',
      },
      rules_hzb: {
        bbmc: [
          { required: true, message: '请输入报表名称', trigger: 'blur' }
        ],
        nf: [
          { required: true, message: '请选择年份', trigger: 'change' }
        ],
        ygxmArr: [
          { required: true, message: '请选择员工', trigger: 'change' }
        ],
      },
      dialogFormVisible_hzb: false,
      curChooseName_hzb: [],
      curChooseId_hzb: [],
      gsbData: [],
      hzbData:[],
      
    };
  },
  mounted() {
    this.getUserList();
    this.getListData();
    this.getListData_hzb();

  },
  methods: {
    //获取管理员信息
    getUserList() {
      let data = {
        dept_id: dept_ids[0],
        page: 1,
        limit: 9999
      }
      this.USERList = [];
      org_users(data).then(res => {
        if (res.code == 1) {
          this.userList = res.data.page_data;
          res.data.page_data.forEach(item => {
            this.USERList.push({
              label: item.user_realname,
              value:item.user_id,
            })
          })
          
        }
      })
    },
    getListData() {
      this.loading = true;
      let transData = {
        page: this.cur_page,
        limit: this.limit,
        gsb_bbmc: this.keyword,
        gsb_nf:this.filteTime
      };
      //公示表
      gsb_list(transData).then((res) => {
        this.loading = false;
        this.applyTable = res.data.page_data;
        this.cur_page = Number(res.data.page_now);
        this.total = Number(res.data.total_rows);
      });
      
    },
    getListData_hzb() {
      let transData = {
        page: this.cur_page_hzb,
        limit: this.limit,
        hzb_bbmc: this.keyword,
        hzb_nf:this.filteTime
      };
      hzb_list(transData).then((res) => {
        this.auditTable = res.data.page_data;
        this.cur_page_hzb = Number(res.data.page_now);
        this.total_hzb = Number(res.data.total_rows);
      });
    },
    
    //新建报表switch
    addData() {
      if (this.activeName == "first") {//公示表
        this.title = "新建公示表";
        this.dialogForm = {
          bbmc: '',
          nf: '',
          ygxmArr:[{label:real_name,value:user_id}]
        };
        this.dialogFormVisible = true;
      } else {//汇总表
        this.title = "新建汇总表";
        this.dialogForm_hzb = {
          bbmc: '',
          nf: '',
          ygxmArr:[{label:real_name,value:user_id}]
        };
        this.dialogFormVisible_hzb = true;
      }
      
    },
   //dialog 弹出提交
    addFormSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.loading = true;
          this.dialogLoading = true;
          
          if (this.activeName == "first") {//公示表
              //多选的数据处理
            let Str_temp_name=[];
            let Str_temp_id=[]
            this.dialogForm.ygxmArr.forEach(item => {
              Str_temp_name.push(item.label);
              Str_temp_id.push(item.value);
            })
            let dataObj = {
              issubmit:1,
              jdbg_jbcb_gsb: {
                gsb_bbmc:this.dialogForm.bbmc,
                gsb_nf:this.dialogForm.nf,
                gsb_ygxm:Str_temp_name.join(),
                gsb_ygxm_id:Str_temp_id.join(),
                gsb_cjr:real_name,
              }
            };
            gsb_add(dataObj).then(res => {
              this.loading = false;
              if (res.code == 1) {
                this.$message({
                  message: res.msg,
                  type: "success",
                });
                this.dialogLoading=false;
                this.dialogFormVisible = false;
                this.getListData();
              } else {
                this.$message({
                  message: res.msg,
                  type: "error",
                });
              }
            })
          } else {//汇总表
            //多选的数据处理
            let Str_temp_name_hzb=[];
            let Str_temp_id_hzb=[]
            this.dialogForm_hzb.ygxmArr.forEach(item => {
              Str_temp_name_hzb.push(item.label);
              Str_temp_id_hzb.push(item.value);
            })
            let dataObj = {
              issubmit:1,
              jdbg_jbcb_hzb: {
                hzb_bbmc:this.dialogForm_hzb.bbmc,
                hzb_nf:this.dialogForm_hzb.nf,
                hzb_ygxm:Str_temp_name_hzb.join(),
                hzb_ygxm_id:Str_temp_id_hzb.join(),
                hzb_cjr:real_name,
              }
            };
            hzb_add(dataObj).then(res => {
              this.loading = false;
              if (res.code == 1) {
                this.$message({
                  message: res.msg,
                  type: "success",
                });
                this.dialogLoading = false;
                this.dialogFormVisible_hzb = false;
                this.getListData_hzb();
              } else {
                this.$message({
                  message: res.msg,
                  type: "error",
                });
              }
            });

          }
        }
      })
    },
    //多选员工姓名
    handleMultiSelect(val) {
      if (this.activeName == "first") {
        this.curChooseName=[];
        this.curChooseId = [];
        val.forEach(item => {
          this.curChooseName.push(item.label);
          this.curChooseId.push(item.value);
        });
      } else {
        this.curChooseName_hzb=[];
        this.curChooseId_hzb=[];
        val.forEach(item => {
          this.curChooseName_hzb.push(item.label);
          this.curChooseId_hzb.push(item.value);
        });
      }
      
    },
    //导出
    exportAll() {
      let Token= JSON.parse(window.localStorage.getItem('userInfo')).token;
      //区别导出报表
      if (this.activeName == "first") {//公示表
        let expId = [];
       this.multipleSelection.forEach(item => {
        expId.push(item.gsb_id);
       })
        let transString = expId.join();
        let link =
        window.globalVariables.api +
        "/jdbg/jbcb_gsb/output?api=xls&page=1&limit=10000&token=" +
        Token+"&gsb_id="+transString;
         window.open(link, "_blank");
      } else {//汇总表
        let expId = [];
        this.multipleSelection.forEach(item => {
          expId.push(item.hzb_id);
        })
          let transString = expId.join();
        let link =
        window.globalVariables.api +
        "/jdbg/jbcb_hzb/output?api=xls&page=1&limit=10000&token=" +
        Token+"&hzb_id="+transString;
        window.open(link, "_blank");
      }
     
    },
    //批量删除
    batchDel() {
      if (this.activeName == "first") {//公示表
        let delId = [];
       this.multipleSelection.forEach(item => {
         delId.push(item.gsb_id);
      })
      let transObj = {
        gsb_id:delId
      }
      this.$confirm("确认删除该申请?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          gsb_del(transObj).then((res) => {
            if (res.code == 1) {
              this.$message({
                message: "申请删除成功！",
                type: "success",
              });
              this.getListData();
            } else {
              this.$message({
                message: res.msg,
                type: "error",
              });
            }
          });
        })
        .catch(() => { });
      } else {//汇总表
        let delId = [];
       this.multipleSelection.forEach(item => {
         delId.push(item.hzb_id);
      })
      let transObj = {
        hzb_id:delId
      }
      this.$confirm("确认删除该申请?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          hzb_del(transObj).then((res) => {
            if (res.code == 1) {
              this.$message({
                message: "申请删除成功！",
                type: "success",
              });
              this.getListData_hzb();
            } else {
              this.$message({
                message: res.msg,
                type: "error",
              });
            }
          });
        })
        .catch(() => { });
      }
    },
    //编辑(未启用)
    handleEdit() {
      // this.curID = item.gsb_id;
      //网络请求
    },
    //diglog_详情
    toDetail(item) {
      if (this.activeName == "first") {//公示表
        this.title = "查看公示表详情";
        let transObj = {
          gsb_id:item.gsb_id
        }
        gsb_detail(transObj)
          .then(res => {
            if (res.code == "1") {
              this.gsbData = res.data.one_info.gsb_json;

            }
            console.log(res,"9090")
          })
          .catch(error => { console.log(error) })
        this.dialogVisible_formS1 = true;
      }else{//汇总表
        this.title = "查看汇总表详情";
        let transObj = {
          hzb_id:item.hzb_id
        }
        hzb_detail(transObj)
        .then(res => {
          if (res.code == "1") {
              this.hzbData = res.data.one_info.hzb_json;
            }
            console.log(res,"9191")
          })
          .catch(error => { console.log(error) })
        this.dialogVisible_formS2 = true;
      }
    },
    //多选
    handleSelectionChange(val) {
      this.multipleSelection = [];
      this.multipleSelection = val;
    },
    //翻页
    handleCurrentChange(val) {
      this.cur_page = val;
      this.getListData();
    },
    //汇总表分页
    handleCurrentChange_hzb(val) {
      this.cur_page_hzb = val;
      this.getListData_hzb();
    },
    //tab切换
    handleTab() {
      console.log( this.activeName,'111')
    },

  },
  
};
</script>

<style scoped>
.formTitle{
  font-size:20px;
  font-weight: 600;
  margin-bottom:10px;
  text-align:center;
}
.everyTR{
  display:flex;
  flex-direction: row;
  justify-content: space-between;
  border:1px #000 solid;
}
.w40{
  width:40%;
}
.w60{
  width:60%;
}
.w50{
  width:50%;
}
.w33{
  width:33%;
}
.TaL{
  text-align: left;
}
.TaC{
  text-align: center;
}
.TaR{
  text-align: right;
}
.singleP{
  min-height:30px;
  border-right:1px #000 solid; 
  box-sizing:border-box;
  padding:5px;
}
.singleP:last-child{
  border-left:0px #000 solid!important; 
}
.singleTitle{
  border-right:1px #000 solid; 
  box-sizing:border-box;
  padding:5px;
}
.singleTitle:last-child{
  border-left:0px #000 solid!important; 
}
.tabHeadOne{
  min-height:30px;
}
.tabHeadOne th{
  border:1px #000 solid;
}
.tabcont td{
  height:30px;
  border:1px #000 solid;
  text-align:center;
}

.tabHeadTwo{
  min-height:30px;
}
.tabHeadTwoFirst_tr{
  width:100%;
}
.tabHeadTwoFirst_tr th{
  border:1px #000 solid;
}
.tabHeadTwoSecond_tr{
  width:100%;
} 
.tabHeadTwoSecond_tr th{
  border: 1px #000 solid;
}
.tabcontSecond td{
  border:1px #000 solid;
}
.tabTfootTwo th{
  border:1px #000 solid;
}
</style>