<template>
  <div id="protectedItems" class="content-main">
    <div id="pdfId" >
      <el-form :inline="true" ref="formInline" :model="formInline" :class="{'demo-form-inline':true,'recordsDetailsTable':true}">
      <div style="text-align: center;font-size: 20px;font-weight: 600;margin-bottom: 20px;">{{formInline.lhnd}}{{jstype == 'ys' ? '年市级储备粮轮换补贴预算申请表' : '年市级储备粮轮换补贴清算申请表'}}</div>
      <div class="flexBox" style="margin-bottom: 10px;">
        <div style="flex: 1;">申报单位：{{formInline.ccqy}}</div>
        <div style="flex: 1;text-align: center;">
          <el-form-item label="品种:">
            <el-select
              disabled
              v-model="formInline.pzbm"
              class="inputWidth"
              placeholder="请选择"
            >
              <el-option
                v-for="i in pzOptions"
                :key="i.dictCode"
                :label="i.dictName"
                :value="i.dictCode"
              ></el-option>
            </el-select>
          </el-form-item>
        </div>
        <div style="flex: 1;text-align: right;" >
          <span>费率：元/吨.年</span>
          <span>单位：吨/元</span>
        </div>
      </div>
      <div style="width: 300px;">
        <div id="bglhbtsubsidy"></div>
      </div>
      <el-table :data="type != 'sq' && jstype== 'qs' ? formInline.liquidateList: formInline.budgetList" border :summary-method="getSummaries" show-summary stripe tooltip-effect="dark">
      	<el-table-column prop="scnf" label="生产年份" align="center"></el-table-column>
      	<el-table-column prop="sjlhsl" label="实际轮换数量" align="center" >
         <template slot-scope="scope">
            <el-input v-if='type == "xg"' clearable v-model="scope.row.sjlhsl" @blur='inputNum(scope.row.sjlhsl,scope.$index)'  placeholder="请输入"></el-input>
            <span v-else>{{String(scope.row.sjlhsl).indexOf('.') > -1 ? Number(scope.row.sjlhsl).toFixed(3) : scope.row.sjlhsl}}
			</span>
          </template>
        </el-table-column>
      	<el-table-column prop="fl" label="费率" align="center"></el-table-column>
      	<el-table-column prop="ccq" label="储存期" align="center"></el-table-column>
      	<el-table-column prop="ygbflhbt" label="应拨付轮换补贴" align="center">
          <template slot-scope="scope">
            <el-input v-if='type == "xg"' clearable v-model="scope.row.ygbflhbt" placeholder="请输入">
            </el-input>
            <span v-else>
				{{String(scope.row.ygbflhbt).indexOf('.') > -1 ? Number(scope.row.ygbflhbt).toFixed(2) : scope.row.ygbflhbt}}
			</span>
          </template>
        </el-table-column>
      	<el-table-column v-if="jstype == 'ys'" prop="ygsq" label="应申请70%" align="center">
        <template slot-scope="scope">
           <span>{{String(scope.row.ygsq).indexOf('.') > -1 ? Number(scope.row.ygsq).toFixed(2) : scope.row.ygsq}}</span>
         </template>
		</el-table-column>
      	<el-table-column v-if="jstype == 'ys'" prop="sjsq" label="实际申请" align="center">
         <template slot-scope="scope">
            <el-input v-if='type == "xg"' clearable v-model="scope.row.sjsq" placeholder="请输入">
            </el-input>
            <span v-else>{{String(scope.row.sjsq).indexOf('.') > -1 ? Number(scope.row.sjsq).toFixed(2) : scope.row.sjsq}}
			</span>
          </template>
        </el-table-column>
      	<el-table-column v-if="jstype == 'qs'" prop="ybfje" label="已拨付金额" align="center">
			<template slot-scope="scope">
			   <span>{{String(scope.row.ybfje).indexOf('.') > -1 ? Number(scope.row.ybfje).toFixed(2) : scope.row.ybfje}}</span>
			 </template>
		</el-table-column>
        
      	<el-table-column v-if="jstype == 'qs'" prop="bcqsje" label="本次清算金额" align="center">
			<template slot-scope="scope">
			   <span>{{String(scope.row.bcqsje).indexOf('.') > -1 ? Number(scope.row.bcqsje).toFixed(2) : scope.row.bcqsje}}</span>
			 </template>
		</el-table-column>
      </el-table>
		<div style="margin-top: 20px;"></div>
		<div class="areawidth" v-if="formInline.ysRemark && jstype == 'ys'">
		   <el-form-item label="备注" label-width="80px">
		   <el-input :readonly="type != 'xg'" type="textarea" :rows="2" clearable v-model="formInline.ysRemark" placeholder="请输入"></el-input>
		   </el-form-item>
		 </div>
		 <div class="areawidth" v-if="formInline.qsRemark && jstype == 'qs'">
		    <el-form-item label="备注" label-width="80px">
		    <el-input :readonly="type != 'xg'" type="textarea" :rows="2" clearable v-model="formInline.qsRemark" placeholder="请输入"></el-input>
		    </el-form-item>
		  </div>
        <el-row style="margin-top: 20px;" v-if="jstype == 'ys'">
		  <el-col :span='6'>
			<el-form-item label="单位负责人:">
				<span>{{formInline.ysDwfzr}}</span>
			</el-form-item>
		  </el-col>
		  <el-col :span='6'>
		  	<el-form-item label="审核:">
		  		<span>{{formInline.ysShr}}</span>
		  	</el-form-item>		  
		  </el-col>
		  <el-col :span='6'>
		  	<el-form-item label="制表:">
		  		<span>{{formInline.ysZbr}}</span>
		  	</el-form-item>		  
		  </el-col>
		  <el-col :span='6'>
		  	<el-form-item label="填报日期:">
		  		<span>{{formInline.ysTbrq}}</span>
		  	</el-form-item>		  
		  </el-col>
        </el-row>
		<el-row style="margin-top: 20px;" v-else>
		  <el-col :span='6'>
			<el-form-item label="单位负责人:">
				<span>{{formInline.qsDwfzr}}</span>
			</el-form-item>
		  </el-col>
		  <el-col :span='6'>
		  	<el-form-item label="审核:">
		  		<span>{{formInline.qsShr}}</span>
		  	</el-form-item>		  
		  </el-col>
		  <el-col :span='6'>
		  	<el-form-item label="制表:">
		  		<span>{{formInline.qsZbr}}</span>
		  	</el-form-item>		  
		  </el-col>
		  <el-col :span='6'>
		  	<el-form-item label="填报日期:">
		  		<span>{{formInline.qsTbrq}}</span>
		  	</el-form-item>		  
		  </el-col>
		</el-row>
		<div v-if="jstype == 'ys'">
			<el-row>
			  <el-form-item label="是否接收" label-width="80px">
				<el-radio-group :disabled="type != 'js'" v-model="formInline.ysJszt">
				  <el-radio :label="1">是</el-radio>
				  <el-radio :label="0">否</el-radio>
				</el-radio-group>
			  </el-form-item>
			</el-row>
			<div class="areawidth">
			   <el-form-item label="接收意见" label-width="80px">
			   <el-input :readonly="type != 'js'" type="textarea" :rows="2" clearable v-model="formInline.ysReceiveOpinion" placeholder="请输入"></el-input>
			   </el-form-item>
			 </div>
			 <el-row>
			   <el-form-item label="接收人" label-width="80px">
				 <el-input clearable :readonly="type != 'js'" v-model="formInline.ysJsr" placeholder="请输入"></el-input>
			   </el-form-item>
			   <el-form-item label="接收时间" label-width="80px">
				   <el-date-picker
				   :readonly="type != 'js'"
					 v-model="formInline.ysJsrq"
					 type="date"
					 placeholder="选择期数"
					 format="yyyy-MM-dd"
					 value-format="yyyy-MM-dd">
					</el-date-picker>
			   </el-form-item>
			 </el-row> 
		</div>
		<div v-if="jstype == 'qs'">
			<el-row>
			  <el-form-item label="是否接收" label-width="80px">
				<el-radio-group :disabled="type != 'js'" v-model="formInline.qsJszt">
				  <el-radio :label="1">是</el-radio>
				  <el-radio :label="0">否</el-radio>
				</el-radio-group>
			  </el-form-item>
			</el-row>
			<div class="areawidth">
			   <el-form-item label="接收意见" label-width="80px">
			   <el-input :readonly="type != 'js'" type="textarea" :rows="2" clearable v-model="formInline.qsReceiveOpinion" placeholder="请输入"></el-input>
			   </el-form-item>
			 </div>
			 <el-row>
			   <el-form-item label="接收人" label-width="80px">
				 <el-input clearable :readonly="type != 'js'" v-model="formInline.qsJsr" placeholder="请输入"></el-input>
			   </el-form-item>
			   <el-form-item label="接收时间" label-width="80px">
				   <el-date-picker
				   :readonly="type != 'js'"
					 v-model="formInline.qsJsrq"
					 type="date"
					 placeholder="选择期数"
					 format="yyyy-MM-dd"
					 value-format="yyyy-MM-dd">
					</el-date-picker>
			   </el-form-item>
			 </el-row> 
		</div>
		
      </el-form>
    </div>

    <div style="text-align: center; margin-top: 20px">
      <!-- <el-button  v-if="type != 'ck' && type == 'xg' " type="primary"
        icon="iconfont iconbaocun" @click="saveZc('0','formInline','1')">保存</el-button> -->
      <!-- <el-button v-if="type != 'ck'&& type == 'xg'" type="primary"
        icon="iconfont icontijiao" @click="saveZc('1','formInline','1')">提交</el-button>
     <el-button type="primary" :loading="stateLoading" @click="gaizhangFn('2')" size="small" class="iconfont icongaizhang"
     	v-if="formInline.ysZt == '91000100' || formInline.ysZt == '91000202'">盖章</el-button> -->
     <!-- <el-button type="primary" @click="saveZc('0','formInline','2')" size="small" class="iconfont iconbohui"
     	v-if="formInline.ysZt == '91000100' || formInline.ysZt == '91000202'">驳回</el-button> -->
		<el-button type="primary" @click="saveZc('0','formInline','3')" size="small" class="iconfont iconbohui"
			v-if="type != 'ck' && (jstype == 'ys' && (formInline.ysZt == '91000200' || formInline.ysZt == '91000202')) || (jstype == 'qs' && (formInline.qsZt == '91000200' || formInline.qsZt == '91000202'))">提交</el-button>
	<el-button type="primary" @click="saveZc('','formInline','4')" size="small" class="iconfont iconbohui"
		v-if="type != 'ck' && ((jstype == 'ys' && formInline.ysZt == '91000201') || (jstype == 'qs' && formInline.qsZt == '91000201')) ">撤销</el-button>
      <el-button @click="cancelClick" type="primary"
        icon="iconfont iconfanhui">返回</el-button>
        <el-button
          type="primary"
          class="iconfont icondaochu11"
          v-show="type == 'dc'"
          @click="exportPdf"
          >导出</el-button
        >
    </div>
  </div>
</template>

<script>
  import {getPzOptions,subsidyUpdate,subsidyInfo} from '@/api/bglhbt/index'
  import htmlToPdf from "@/utils/htmlToPdf";
  import {dateFormat} from '@/utils/index'
  export default{
    data() {
      return {
        stateLoading:false,
        type:this.$route.query.type,
        jstype:this.$route.query.jstype,
        printType:false,
        pzOptions:[],
        formInline:{
		  lhnd:new Date().getFullYear(),
          type:'budget',
          pzbm:'',
          pzmc:'',
          dataType:'0',
          ysDwfzr:'',
          ysZbr:'',
          ysShr:'',
          ysTbrq:'',
		  ysJszt:1,
		  ysJsr:'',
		  ysJsrq:'',
		  ysReceiveOpinion:'',
		  qsJszt:1,
		  qsJsr:'',
		  qsJsrq:'',
		  qsReceiveOpinion:'',
          orgCode:sessionStorage.getItem("orgCode"),
          sskdbm:sessionStorage.getItem("tyshxydm")+'001',
          ccqy:sessionStorage.getItem("orgName"),
          deptCode:sessionStorage.getItem("tyshxydm")+'001',
          ysGz:'',
          ysGzzt:0,
          budgetList:[
            // {
            //   scnf:'',
            //   sjlhsl:'',
            //   fl:null,
            //   ccq:null,
            //   sjsq:null,
            //   ygsq:null,
            // }
          ],
        }
      }

    },
    created(){
      if(this.$route.query.id){
        this.getJxcInfo()
      }
      getPzOptions().then((res) => {
        this.pzOptions = res.data;
      });
    },
    methods:{
		//合计
		getSummaries(param){
		  console.log(param,'yerwe---')
		   const { columns, data } = param;
		   const sums = [];
		   columns.forEach((column, index) => {
			 if (index === 0) {
			   sums[index] = '合计';
			   return;
			 }
			 const values = data.map(item => Number(item[column.property]));
			 if (!values.every(value => isNaN(value))) {
			   sums[index] = values.reduce((prev, curr) => {
				 if(column.property=='fl' || column.property == 'ccq'){
				   return ''
				 }else{
					if(column.property=='sjlhsl'){
						// var sum=null
						// sum=Number(prev) + Number(curr)
					    return String(Number(prev) + Number(curr)).indexOf('.') > -1 ? Number(Number(prev) + Number(curr)).toFixed(3) : Number(prev) + Number(curr);	
					}else{
						return String(Number(prev) + Number(curr)).indexOf('.') > -1 ? Number(Number(prev) + Number(curr)).toFixed(2) : Number(prev) + Number(curr);
					}
				   
				 }
			   }, 0);
			 }
		   });
			return sums;
		
		},
      cancelClick(){
		if(this.$route.query.pageType == 'summary'){
			if(this.$route.query.jstype == 'ys'){
				this.$router.push({
				  name: "ysbtsummaryIndex",
				  query:{
					ordialog:'1'
				  }
				});  
			}else if( this.$route.query.jstype == 'qs'){
				this.$router.push({
				  name: "qsbtsummaryIndex",
				  query:{
					ordialog:'1'
				  }
				});  
			}
			
		}else{
			this.$router.push({
			  name: "bglhbtIndex",
			});
		}
        
      },
      saveZc(type,formName,shtype,sussInfo,errInfo){
        console.log('66555-==============')
        this.shtype=shtype
        if(shtype ==2){
          this.formInline.ysGzzt=type
        }else{
          this.formInline.operationType=type
        }
        if(this.jstype =='ys'){
          this.formInline.type ='budget'
        }else{
          this.formInline.type ='liquidate'
        }
        this.$refs[formName].validate((valid) => {
          if (valid) {
            if(this.$route.query.id){
              // console.log(this.formInline,'ooiyy7778-----')
              subsidyUpdate(this.formInline,this.shtype).then(res =>{
                if(res.infoCode == 200){
                  this.$message({
                    message: "提交成功",
                    type: "success",
                  });
                  this.$router.push({
                    name: "bglhbtIndex",
                  });
                }else{
                  this.$message.error(res.msg);
                }
              })
            }
          }
        })

      },
      getJxcInfo(){
        var data={
          rsId:this.$route.query.id
        }
        subsidyInfo(data).then(res =>{
          if(res.infoCode == 200){
            this.formInline=res.data
			if(this.jstype == 'ys'){
				this.formInline.ysJszt=1
				this.formInline.ysJsr=this.formInline.ysJsr ? this.formInline.ysJsr : sessionStorage.getItem("userName")
				this.formInline.ysJsrq=this.formInline.ysJsrq ? this.formInline.ysJsrq : dateFormat(new Date())
			    if(this.type == 'js'){
					this.formInline.ysReceiveOpinion=''
					this.formInline.ysJsrq=dateFormat(new Date())
					this.formInline.ysJsr=sessionStorage.getItem("userName")
					this.formInline.ysJszt=1
				}
			if (this.formInline.ysGz) {
			  if (this.formInline.ysGz.indexOf("newSeal") == -1) {
			    this.$nextTick(() => {
			      this.$ShowSeal("bglhbtsubsidy", 1);
			      this.$SetSealData(this.formInline.ysGz, 0, "lingdao", 1);
			    });
			  } else {
			    this.$signatureOnload(
			      "bglhbtsubsidy",
			      this.formInline.ysGz.substring(7)
			    );
			  }
			}
			}else{
				this.formInline.qsJszt=1
				this.formInline.qsJsr=this.formInline.qsJsr ? this.formInline.qsJsr : sessionStorage.getItem("userName")
				this.formInline.qsJsrq=this.formInline.qsJsrq ? this.formInline.qsJsrq : dateFormat(new Date())
			    if(this.type == 'js'){
			    	this.formInline.qsReceiveOpinion=''
			    	this.formInline.qsJsrq=dateFormat(new Date())
			    	this.formInline.qsJsr=sessionStorage.getItem("userName")
			    	this.formInline.qsJszt=1
			    }
			if (this.formInline.qsGz) {
			  if (this.formInline.qsGz.indexOf("newSeal") == -1) {
			    this.$nextTick(() => {
			      this.$ShowSeal("bglhbtsubsidy", 1);
			      this.$SetSealData(this.formInline.qsGz, 0, "lingdao", 1);
			    });
			  } else {
			    this.$signatureOnload(
			      "bglhbtsubsidy",
			      this.formInline.qsGz.substring(7)
			    );
			  }
			}
			}
            
			
          }
        })
      },
      exportPdf() {
        this.printType = true;
        let _this = this;
        setTimeout(function () {
          htmlToPdf.downloadPDF(
            document.querySelector("#pdfId"),
            "储存费补贴表.pdf"
          );
          _this.printType = false;
        }, 100);
      },
      inputNum(val,index){
        // console.log(val,index,'88888========')
        // let all = 0;
        var ygbflhbt=Number(this.formInline.budgetList[index].sjlhsl*this.formInline.budgetList[index].fl*this.formInline.budgetList[index].ccq)
        this.$set(
          this.formInline.budgetList[index],
          "ygbflhbt",
          String(ygbflhbt).indexOf(".") > -1
            ? Number(ygbflhbt).toFixed(0)
            : Number(ygbflhbt)
        );
        console.log(this.formInline.budgetList[index].ygbflhbt,'9912---------')
        var ygsq=ygbflhbt*0.7
        console.log(ygsq,'9912---------')
        this.$set(
          this.formInline.budgetList[index],
          "ygsq",
          String(ygsq).indexOf(".") > -1
            ? Number(ygsq).toFixed(2)
            : Number(ygsq)
        );
        console.log(this.formInline.budgetList[index].ygsq,'uyytt7777777777')
        var sjsq=ygsq
        this.$set(
          this.formInline.budgetList[index],
          "sjsq",
          String(sjsq).indexOf(".") > -1
            ? Number(sjsq).toFixed(2)
            : Number(sjsq)
        );
      },
    }
  }
</script>

<style scoped lang="scss">
.recordsDetailsTable{
    margin: 40px 0px 0px 0px;
    background-color: #fff;
    font-size: 14px;
    padding-bottom: 20px;
    table {
      width: 100%;
      margin-top: 10px;
      font-size: 14px;
    }
    .tdsize{
      font-size: 18px;
      font-weight: 700;
    }
    td,
    th {
      text-align: center;
      border: 1px solid #eaeaea;
      word-wrap: break-word;
      height: 40px;
    }
    span,
    .el-input,
    .el-textarea {
      font-size: 12px;
    }
}
.title-name{
    text-align: center;
    font-size: 22px;
    font-weight: 600;
  }
  .line-box{
    display: flex;
  }
  .flexBox{
    display: flex;
    line-height: 40px;
    height: 40px;
    // text-align: center;
  }
  .areawidth{
    margin-top: 20px;
    width: 100%;
  }
 .areawidth /deep/ .el-textarea__inner{
   width: 100%!important;
 }
 // .el-form--inline .el-form-item
 .areawidth /deep/.el-form-item{
   width: 100%!important;
 }
 .areawidth /deep/ .el-form-item__content{
   width: 93%!important;
 }
 .printPdf{
   margin: 40px;
 }
 #pdfId{
     background-color: #fff;
     /* overflow-y: auto; */
     margin: 10px;
     // border: 1px solid rgb(244, 245, 248);
     padding: 10px;
 }
</style>
<style>
  #bglhbtsubsidy {
    position: relative !important;
  }

  #bglhbtsubsidy > div {
    left: 80px !important;
    top: -80px !important;
  }
</style>
