devProjectViewJt/src/views/dev/nodivAndnofee.vue

<!-- 计费与未拆分数据比对 和 拆分与未计费数据比对 -->
<template>
   <div id="first_div_0507">
     <el-form :inline="true" :model="formInline" :label-position="right"   style="width:100%;height: 100%">
       <el-form-item label="日期："   class="s_el_row">
<!--         <el-date-picker
             v-model="rpTime"
             type="datetimerange"
             range-separator="To"
             start-placeholder="开始时间"
             end-placeholder="结束时间"
             value-format="YYYY-MM-DD HH:mm:ss"
             format="YYYY-MM-DD HH:mm:ss"
         />-->

         <el-date-picker
             v-model="rpTime"
             type="date"
             placeholder="选择日期"
             value-format="YYYY-MM-DD"
             format="YYYY-MM-DD">
         </el-date-picker>
       </el-form-item>
       <el-form-item  label="PASSID：" style="width:13%" >
         <el-input v-model="passid"  clearable></el-input>
       </el-form-item>
       <el-form-item  label="车牌号：" style="width:13%" >
         <el-input v-model="vehicleId"  clearable></el-input>
       </el-form-item>
       <el-form-item label="分公司名称："  class="s_el_row" style="width:13%">
         <el-select v-model="subcomno"  @change="changesubcomnoValue" filterable placeholder="请选择..." clearable="true" style="width:100%;height:100%;border-color: gainsboro">
           <el-option
               v-for="item in subcomDatas"
               :key="item.VALUE"
               :label="item.LABEL"
               :value="item.VALUE">
           </el-option>
         </el-select>
       </el-form-item>
       <el-form-item label="路段名称："  class="s_el_row" style="width:12%">
         <el-select v-model="roadno" @change="changeroadValue" filterable placeholder="请选择..." clearable style="width:100%;height:100%;border-color: gainsboro">
           <el-option
               v-for="item in roadDatas"
               :key="item.VALUE"
               :label="item.LABEL"
               :value="item.VALUE">
           </el-option>
         </el-select>
       </el-form-item>
       <el-form-item label="收费站："  class="s_el_row" style="width:10%">
         <el-select v-model="stano"  filterable placeholder="请选择..." style="width:100%;height:100%;border-color: gainsboro" clearable>
           <el-option
               v-for="item in staDatas"
               :key="item.VALUE"
               :label="item.LABEL"
               :value="item.VALUE">
           </el-option>
         </el-select>
       </el-form-item>
<!--       <el-form-item label="匹配类型："  class="s_el_row" style="width:10%">
         <el-select v-model="multiType"  filterable placeholder="请选择..." style="width:100%;height:100%;border-color: gainsboro" clearable>
           <el-option
               v-for="item in multiTypeList"
               :key="item.VALUE"
               :label="item.LABEL"
               :value="item.VALUE">
           </el-option>
         </el-select>
       </el-form-item>-->
       <el-form-item  style="padding: 0px;margin-right:5px;">
         <el-radio-group v-model="radio" @change="changeRadio" style="margin-right: 10px">
           <el-radio :label="5">未拆分(有计费数据)</el-radio>
<!--           <el-radio :label="4">无计费有拆分</el-radio>-->
           <el-radio :label="2">计费大于拆分</el-radio>
         </el-radio-group>
<!--       <el-switch
             v-if="showProvince"
             v-model="provinceValue"
             active-text="本省"
             active-value="b"
             inactive-text="跨省"
             inactive-value="k"
         @change="changeProvince">
         </el-switch>-->


       </el-form-item>
       <el-form-item label=""  class="s_el_row" style="width:12%"  v-if="showProvince">
         <el-select v-model="provinceValue" @change="changeProvince" filterable placeholder="请选择..." clearable style="width:100%;height:100%;border-color: gainsboro">
           <el-option
               v-for="item in provinceList"
               :key="item.VALUE"
               :label="item.LABEL"
               :value="item.VALUE">
           </el-option>
         </el-select>
       </el-form-item>
       <el-form-item  label="比值(计费金额-拆分金额)/元：" style="padding: 0px;margin-left:5px;" v-show="rateValueShow">
         <el-input-number v-model="rateValue" :precision="2" :min="0" :step="0.1"  ></el-input-number>
       </el-form-item>
       <el-form-item label="" style="width:8%;margin-right:5px" class="s_el_row">
         <div  style="display:flex;text-align: left; height:100%; position: relative;margin:0;padding:0">
           <el-button type="primary" style="margin-top: 0px;" @click="search" class="query_button" size="default" :icon="searchButton">查询</el-button>
           <el-button type="primary" style="margin-top: 0px;" v-if="showQueryButton" @click="querySearch" class="query_button" size="default" :icon="viewButton">查看稽核数据</el-button>
           <el-button type="primary" style="margin-top: 0px;" v-if="showExportButton" @click="exportCommonExcle" class="query_button" size="default" :icon="uploadButton">导出</el-button>
<!--           <el-button type="primary" style="margin-top: 0px;margin-left: 20px;background-color: #eec10d" @click="search"  v-if="matchButoon" class="query_button" size="default" >一键匹配</el-button>-->
         </div>
       </el-form-item>
     </el-form>
   </div>
   <div id="second_div_0507" v-show="showFeeNoDiv">
     <feeAndNodiv ref="feeAndNodiv" />
   </div>
  <div id="second_div_0508" v-show="showDivNofee">
    <divAndNoFee ref="divAndNoFee" />
  </div>
  <div id="second_div_0611" v-show="showQueryData">
    <querySolveData ref="querySolveData" />
  </div>
  <div id="second_div_0609" v-show="showProvinceData">
    <provinceDetail ref="provinceDetail" />
  </div>
</template>

<style scoped>
#first_div_0507{
  height: 10%;
  width: 100%;
}
#second_div_0507{
  height: 88%;
  width: 100%;
}
#second_div_0508{
  height: 88%;
  width: 100%;
}
#second_div_0609{
  height: 88%;
  width: 100%;
}
#second_div_0611{
  height: 88%;
  width: 100%;
}
</style>
<script>
import {
  Search, Upload,View
} from '@element-plus/icons-vue'
import { getSelectList} from "@/util/api/api";
import feeAndNodiv from "@/views/dev/detail/nodivandnofee/feeAndNodiv.vue"
import divAndNoFee from "@/views/dev/detail/nodivandnofee/divAndNoFee.vue"
import provniceData from "@/views/dev/detail/nodivandnofee/provinceData.vue"
import provinceDetail from "@/views/dev/detail/nodivandnofee/provinceDetail.vue"
import querySolveData from "@/views/dev/detail/nodivandnofee/querySolveData.vue"
import tool from "@/util/tool";
import {rateEmits} from "element-plus";
var _this;
export default {
  name: "nodivAndnofee",
  computed: {
    rateEmits() {
      return rateEmits
    }
  },
  data() {
    return {
      showFeeNoDiv:true,
      showDivNofee:false,
      radio:5,
      rpTime:"",
      searchButton:Search,
      viewButton:View,
      clickDialog:false,
      divStatus:"",
      divStatusList:[],
      queryStartTime:"",
      queryEndTime:"",
      uploadButton:Upload,
      subcomDatas: [],//分公司
      roadDatas: [],//路段
      staDatas: [],//收费站
      multiTypeList: [{"VALUE":"Y","LABEL":"匹配一条"},{"VALUE":"M","LABEL":"匹配多条"},{"VALUE":"W","LABEL":"未匹配"}],//匹配类型
      provinceList:[{"VALUE":"ALL","LABEL":"全部"},{"VALUE":"b","LABEL":"本省"},{"VALUE":"k","LABEL":"跨省"}],
      subcomno: "",
      roadno: "",
      stano: "",
      multiType: "",
      passid: "",
      vehicleId: "",
      divstatus:4,
      matchButoon:true,
      provinceValue:"ALL",
      showProvince:false,
      showProvinceData:false,
      rateValueShow:false,
      showQueryButton:true,
      showExportButton:true,
      showQueryData:false,
      paramAll:{},
      rateValue:1
    }
  },
  methods: {
    changeRadio(value){
        if(value===5){
          this.showFeeNoDiv=true;
          this.showDivNofee=false;
          this.showProvinceData=false;
          this.showProvince=false;
          this.showQueryData=false;
          this.divstatus=4;
          this.matchButoon=true;
          this.showQueryButton=true;
          this.rateValueShow=false;
          this.showExportButton=true;
        }else if(value===4){
          this.showFeeNoDiv=false;
          this.showProvinceData=false;
          this.showProvince=false;
          this.showDivNofee=true;
          this.showQueryButton=true;
          this.showQueryData=false;
          this.divstatus=5;
          this.matchButoon=true;
          this.rateValueShow=false;
          this.showExportButton=false;
        }else{//计费大于拆分
          this.matchButoon=false;
          this.showFeeNoDiv=false;
          this.showDivNofee=false;
          this.showQueryButton=false;
          this.showQueryData=false;
          this.showProvinceData=true;
          this.showProvince=true;
          this.paramAll.feeStatus=2;
          this.rateValueShow=true;
          this.showExportButton=true;
        }
      this.paramAll.status=value;
      this.paramAll.divstatus=this.divstatus;
    },changeProvince(){
/*      if(this.rpTime){
        this.queryStartTime=this.rpTime+" 00:00:00";
        this.queryEndTime=this.rpTime+" 00:00:00";
        this.tableloading=true;
      }else{
        alert("请选择日期");
        return ;
      }
      this.paramAll.status=2;
      this.paramAll.bak1=(this.provinceValue==="ALL")?"":this.provinceValue;
      this.$refs["provinceDetail"].refreshProvinceData(this.paramAll)*/
    },search() {//查询
      if(this.rpTime){
      /*  this.queryStartTime=this.rpTime[0];
        this.queryEndTime=this.rpTime[1];*/
        this.queryStartTime=this.rpTime+" 00:00:00";
        this.queryEndTime=this.rpTime+" 00:00:00";
        this.tableloading=true;
      }else{
        alert("请选择日期");
        return ;
      }
      this.paramAll.queryStartTime=this.queryStartTime;
      this.paramAll.queryEndTime=this.queryEndTime;
      this.paramAll.subcomno=this.subcomno;
      this.paramAll.roadno =this.roadno;
      this.paramAll.stano =this.stano;
      this.paramAll.multiType =this.multiType;
      this.paramAll.status=this.radio;
      this.paramAll.passid=this.passid;
      this.paramAll.vehicleId=this.vehicleId;
      this.changeRadio(this.radio);
      if(this.radio ===5){
        this.paramAll.divstatus=4;
        this.$refs["feeAndNodiv"].refreshData(this.paramAll)
      }else if(this.radio ===4){
        this.paramAll.divstatus=5;
        this.$refs["divAndNoFee"].refreshData(this.paramAll)
      }else{
        this.paramAll.feeStatus=2;
        this.paramAll.status=2;
        this.paramAll.bak1=(this.provinceValue==="ALL")?"":this.provinceValue;
        this.paramAll.rateValue=this.rateValue;
        this.$refs["provinceDetail"].refreshProvinceData(this.paramAll)
      }

    },exportCommonExcle(){
      if(this.rpTime){
        /*  this.queryStartTime=this.rpTime[0];
          this.queryEndTime=this.rpTime[1];*/
        this.queryStartTime=this.rpTime+" 00:00:00";
        this.queryEndTime=this.rpTime+" 00:00:00";
        this.tableloading=true;
      }else if(this.showQueryData){
        console.log("导出稽核数据")
      }else{
        alert("请选择日期");
        return ;
      }
      this.paramAll.queryStartTime=this.queryStartTime;
      this.paramAll.queryEndTime=this.queryEndTime;
      this.paramAll.subcomno=this.subcomno;
      this.paramAll.roadno =this.roadno;
      this.paramAll.stano =this.stano;
      this.paramAll.multiType =this.multiType;
      this.paramAll.status=this.radio;
      this.paramAll.passid=this.passid;
      this.paramAll.vehicleId=this.vehicleId;
      if(this.radio ===5 && !this.showQueryData){
        this.paramAll.divstatus=4;
        this.paramAll.rateValue="";
        this.$refs["feeAndNodiv"].exportExcleFee(this.paramAll)
      }else if(this.radio ===4 && !this.showQueryData){
        this.paramAll.divstatus=5;
        this.$refs["divAndNoFee"].exportExcleDivFee(this.paramAll)
      }else if(this.radio ===2 && !this.showQueryData){
        this.paramAll.feeStatus=2;
        this.paramAll.bak1=(this.provinceValue==="ALL")?"":this.provinceValue;
        this.paramAll.rateValue=this.rateValue;
        this.$refs["provinceDetail"].exportExcleProvince(this.paramAll)
      }else if(this.showQueryData){
        this.paramAll.status="";
        this.paramAll.status="";
        this.$refs["querySolveData"].exportExcleQuery(this.paramAll)
      }else{}
    },querySearch(){
      console.log("是否选择了日期==="+this.rpTime);
      if(!this.rpTime){
        this.paramAll.queryStartTime="";
        this.paramAll.queryEndTime="";
      }else{
        this.paramAll.queryStartTime=this.queryStartTime;
        this.paramAll.queryEndTime=this.queryEndTime;
      }
      this.paramAll.subcomno=this.subcomno;
      this.paramAll.roadno =this.roadno;
      this.paramAll.stano =this.stano;
      this.paramAll.multiType =this.multiType;
      this.paramAll.status=this.radio;
      this.paramAll.passid=this.passid;
      this.paramAll.vehicleId=this.vehicleId;
      this.showQueryData=true;
      this.showExportButton=true;
      this.showFeeNoDiv=false;
      this.showDivNofee=false;
      this.showProvinceData=false;
      this.showProvince=false;
      this.$refs["querySolveData"].refreshQueryData(this.paramAll)
    },showDivDetial(row,column,e){
      this.feeunitTitleMain=row.tollintervalidname;
      this.feeDetailShow=true;
      this.tollvalid=row.tollintervalid;
    }, changesubcomnoValue() {
      this.stano="";
      this.roadno="";
      getRoadlist();
      getStalist();

    }, changeroadValue() {
      this.stano="";
      getStalist();
    }
  },
  components: {
    feeAndNodiv,
    divAndNoFee,
    provniceData,
    querySolveData,
    provinceDetail
  },
  mounted() {
    _this=this;
    getsubcomlist();
    getRoadlist();
    getStalist();
/*
    let selectType={
      "selectType":"DIVSTATUS"
    }
    getSelectList(selectType).then(res=>{
      this.divStatus=1;
      if(res.code>0){
        this.divStatusList=res.data;
      }
    })
*/

  }
}

function getsubcomlist() {
  let staParams = {
    "subcomno": _this.subcomno,
    "roadno": _this.roadno,
    "selectType": "SUBCOM"
  }
  getSelectList(staParams).then(
      res => {
        if (res.data) {
          _this.subcomDatas = res.data
        } else {
          _this.subcomDatas = [{}];
        }
      }
  )
}

function getRoadlist() {
  let staParams = {
    "subcomno": _this.subcomno,
    "roadno": _this.roadno,
    "selectType": "ROAD"
  }
  getSelectList(staParams).then(
      res => {
        if (res.data) {
          _this.roadDatas = res.data
        } else {
          _this.roadDatas = [{}];
        }
      }
  );
}

function getStalist() {
  let staParams = {
    "subcomno": _this.subcomno,
    "roadno": _this.roadno,
    "selectType": "STANO"
  }
  getSelectList(staParams).then(
      res => {
        if (res.data) {
          _this.staDatas = res.data
        } else {
          _this.staDatas = [{}];
        }
      }
  )
}
function getCurrentDate(){
  var myDate = new Date(); //获取今天日期
  myDate.setDate(myDate.getDate() - 1);
  // dateTemp = myDate.getFullYear()+"/"+(c)+"/"+myDate.getDate();
  return myDate.getFullYear()+"-"+((myDate.getMonth()+1) >9?(myDate.getMonth()+1):"0"+(myDate.getMonth()+1))+"-"+(myDate.getDate() >9?myDate.getDate():"0"+myDate.getDate());
}
</script>