<template>
  <div id="protectedItems" class="content-main">
    <el-form :inline="true" ref="formInline" :model="formInline" class="demo-form-inline recordsDetailsTable">
    <div style="text-align: center;font-size: 20px;font-weight: 600;margin-bottom: 20px;">市级储备粮油进销存报表</div>
	<div class="flexBox">
      <div style="flex: 1;">上报单位：{{formInline.sskdmc}}</div>
      <div style="flex: 1;text-align: center;">填报期数：{{formInline.period}}</div>
      <div style="flex: 1;text-align: right;" >
        <span>单位：吨</span>
      </div>
    </div>
	<div style="width: 300px;">
		<div id="grainsubsidy"></div>
	</div>
      <table>
        <thead>
          <tr>
            <th rowspan="2">
              品名
            </th>
            <th rowspan="2">期初库存</th>
            <th rowspan="1" colspan="3">收入
             </th>
           <th rowspan="1" colspan="4">支出
            </th>
            <th rowspan="2">期末库存</th>
          </tr>
          <tr>
          <td>合计</td>
          <td>采购</td>
          <td>其它</td>
          <td colspan='1'>合计</td>
          <td colspan='1'>销售</td>
          <td colspan='1'>损耗</td>
          <td colspan='1'>其它</td>
          </tr>
        </thead>
       <tbody>
          <tr v-for="(item,index) in formInline.detailList">
            <td>
              {{item.pzmc}}
              <!-- {{String(item.pzmc).indexOf(".") > -1
                ? Number(item.pzmc).toFixed(3)
                : item.pzmc}}</td> -->
            <td>
              <span v-if="type != 'xg' || index ==0 || index ==1 || index ==2 || index ==3 || index ==8 || index ==13 || index ==16 || index ==19 || index ==21">
              {{String(item.initial).indexOf(".") > -1
                ? Number(item.initial).toFixed(3)
                : item.initial}}</span>
              <el-form-item v-else :key="item.key"
                 :prop="'detailList.' + index + '.initial'"
                 :rules="[
                   {
                     pattern:/^(-)?(0|[1-9]\d*)(\s|$|\.\d{1,3}\b)/,
                     message: '请输入数字,最多保留三位小数',
                     trigger: 'blur',
                   },
                 ]">
              <el-input clearable v-model="item.initial" @change="gcinputnum(index,'initial')" placeholder="请输入">
              </el-input>
              </el-form-item>
            </td>
            <td style="width: 120px;">
              <!-- <span v-if="type == 'ck'|| index ==0 || index ==1 || index ==2 || index ==3 || index ==8 || index ==13 || index ==16 || index ==19 || index ==21">{{item.incomeTotal}}</span> -->
              <span>{{String(item.incomeTotal).indexOf(".") > -1
                ? Number(item.incomeTotal).toFixed(3)
                : item.incomeTotal}}</span>
			  
            </td>
            <td>
              <span v-if="type != 'xg'|| index ==0 || index ==1 || index ==2 || index ==3 || index ==8 || index ==13 || index ==16 || index ==19 || index ==21">{{item.purchase}}</span>
              <el-form-item v-else :key="item.key"
                 :prop="'detailList.' + index + '.purchase'"
                 :rules="[
                   {
                     pattern:/^(-)?(0|[1-9]\d*)(\s|$|\.\d{1,3}\b)/,
                     message: '请输入数字,最多保留三位小数',
                     trigger: 'blur',
                   },
                 ]">
              <el-input clearable v-model="item.purchase" @change="gcinputnum(index,'purchase')" placeholder="请输入"></el-input>
              </el-form-item>
            </td>
            <td>
              <span v-if="type != 'xg'|| index ==0 || index ==1 || index ==2 || index ==3 || index ==8 || index ==13 || index ==16 || index ==19 || index ==21">{{item.otherIncome}}</span>
              <el-form-item v-else :key="item.key"
                 :prop="'detailList.' + index + '.otherIncome'"
                 :rules="[
                   {
                     pattern:/^(-)?(0|[1-9]\d*)(\s|$|\.\d{1,3}\b)/,
                     message: '请输入数字,最多保留三位小数',
                     trigger: 'blur',
                   },
                 ]">
              <el-input clearable v-model="item.otherIncome" @change="gcinputnum(index,'otherIncome')" placeholder="请输入"></el-input>
              </el-form-item>
            </td>
            <td style="width: 120px;">
				<span>{{String(item.expenseTotal).indexOf(".") > -1
                ? Number(item.expenseTotal).toFixed(3)
                : item.expenseTotal}}</span>
            </td>
            <td>
              <span v-if="type != 'xg'|| index ==0 || index ==1 || index ==2 || index ==3 || index ==8 || index ==13 || index ==16 || index ==19 || index ==21">{{item.sale}}</span>
              <el-form-item v-else :key="item.key"
                 :prop="'detailList.' + index + '.sale'"
                 :rules="[
                   {
                    pattern:/^(-)?(0|[1-9]\d*)(\s|$|\.\d{1,3}\b)/,
                    message: '请输入数字,最多保留三位小数',
                     trigger: 'blur',
                   },
                 ]">
              <el-input clearable v-model="item.sale" @change="gcinputnum(index,'sale')" placeholder="请输入"></el-input>
              </el-form-item>
            </td>
            <td>
              <span v-if="type != 'xg' || index ==0 || index ==1 || index ==2 || index ==3 || index ==8 || index ==13 || index ==16 || index ==19 || index ==21">{{item.loss}}</span>
              <el-form-item v-else :key="item.key"
                 :prop="'detailList.' + index + '.loss'"
                 :rules="[
                   {
                     pattern:/^(-)?(0|[1-9]\d*)(\s|$|\.\d{1,3}\b)/,
                     message: '请输入数字,最多保留三位小数',
                     trigger: 'blur',
                   },
                 ]">
              <el-input clearable v-model="item.loss" @change="gcinputnum(index,'loss')"  placeholder="请输入"></el-input>
              </el-form-item>
            </td>
            <td>
              <span v-if="type != 'xg' || index ==0 || index ==1 || index ==2 || index ==3 || index ==8 || index ==13 || index ==16 || index ==19 || index ==21">{{item.otherExpense}}</span>
              <el-form-item v-else :key="item.key"
                 :prop="'detailList.' + index + '.otherExpense'"
                 :rules="[
                   {
                     pattern:/^(-)?(0|[1-9]\d*)(\s|$|\.\d{1,3}\b)/,
                     message: '请输入数字,最多保留三位小数',
                     trigger: 'blur',
                   },
                 ]">
              <el-input clearable v-model="item.otherExpense" @change="gcinputnum(index,'otherExpense')"  placeholder="请输入"></el-input>
              </el-form-item>
            </td>
            <td style="width: 120px;">
				<span>{{String(item.ending).indexOf(".") > -1
                ? Number(item.ending).toFixed(3)
                : item.ending}}</span>
              
              <!-- {{item.ending}} -->
              <!-- <span v-if="type == 'ck'|| index ==0 || index ==1 || index ==2 || index ==3 || index ==8 || index ==13 || index ==16 || index ==19 || index ==21">{{item.ending}}</span>
              <el-form-item v-else :key="item.key"
                 :prop="'detailList.' + index + '.ending'"
                 :rules="[
                   {
                     pattern:/(^([-]?)[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^([-]?)(0){1}$)|(^([-]?)[0-9]\.[0-9]([0-9])([0-9])?$)/,
                     message: '请输入数字,最多保留三位小数',
                     trigger: 'blur',
                   },
                 ]">
              <el-input clearable v-model="item.ending" @change="gcinputnum(index,'ending')"  placeholder="请输入"></el-input>
              </el-form-item> -->
            </td>
          </tr>

        </tbody>
      </table>
	  <!-- <div v-if="type == 'ck'">
		<el-form-item label="制表:">
			<span>{{formInline.reporter}}</span>
		  
		</el-form-item>  
	  </div> -->
	  <div style="margin-top: 20px;"></div>
     <div class="areawidth" v-if="formInline.remark">
        <el-form-item label="备注" label-width="80px">
        <el-input :readonly="type != 'xg'" type="textarea" :rows="2" clearable v-model="formInline.remark" placeholder="请输入"></el-input>
        </el-form-item>
      </div>
	  <div>
		 <el-row>
			<el-col :span='6'>
				<el-form-item label="单位负责人:">
				   <span>{{formInline.leader}}</span>
				  <!-- <el-input clearable :readonly="type != 'xg'" v-model="formInline.leader" placeholder="请输入"></el-input> -->
				</el-form-item>
			</el-col>
			<el-col :span='6'>
				<el-form-item label="审核:">
					<span>{{formInline.auditor}}</span>
				  <!-- <el-input clearable :readonly="type != 'xg'" v-model="formInline.auditor" placeholder="请输入"></el-input> -->
				</el-form-item>
			</el-col>
			<el-col :span='6'>
				<el-form-item label="制表:">
					<span>{{formInline.reporter}}</span>
				  <!-- <el-input clearable :readonly="type != 'xg'" v-model="formInline.reporter" placeholder="请输入"></el-input> -->
				</el-form-item>
			</el-col>
			<el-col :span='6'>
				<el-form-item label="填报日期:">
					<span>{{formInline.reportDate}}</span>
				 <!-- <el-date-picker
				 :readonly="type != 'xg'"
				   v-model="formInline.reportDate"
				   type="date"
				   placeholder="选择期数"
				   format="yyyy-MM-dd"
				   value-format="yyyy-MM-dd">
				  </el-date-picker> -->
				</el-form-item>
			</el-col>
		 </el-row>
		 <el-row>
		 		  <el-form-item label="是否接收" label-width="80px">
		 		    <el-radio-group :disabled="type != 'js'" v-model="formInline.receiveStatus">
		 		      <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.receiveOpinion" 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.receiver" placeholder="请输入"></el-input>
		 		   </el-form-item>
		 		   <el-form-item label="接收时间" label-width="80px">
		 			   <el-date-picker
		 			   :readonly="type != 'js'"
		 				 v-model="formInline.receiveDate"
		 				 type="date"
		 				 placeholder="选择期数"
		 				 format="yyyy-MM-dd"
		 				 value-format="yyyy-MM-dd">
		 				</el-date-picker>
		 		   </el-form-item>
		  </el-row> 
	  </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="saveZc('','formInline','3')" size="small" class="iconfont icongaizhang"
       	v-if="type != 'ck' && (formInline.status == '91000202' || formInline.status == '91000200')">提交</el-button>
		<!-- <el-button type="primary" :loading="stateLoading" @click="saveZc('','formInline','3')" size="small" class="iconfont iconbohui"
			v-if="type != 'ck' && (formInline.status == '91000202' || formInline.status == '91000200')">驳回</el-button> -->
       <el-button type="primary" @click="saveZc('','formInline','4')" size="small" class="iconfont iconbohui"
       	v-if="type != 'ck' && formInline.status == '91000201' ">撤销</el-button>
        <el-button @click="cancelClick" type="primary"
          icon="iconfont iconfanhui">返回</el-button>
      </div>

    </el-form>
  </div>
</template>

<script>
  import {
    // reserveReportSave,
    reserveReportInfo,
    purchaseStockUpdate
  } from "@/api/cwbb/index";
  import {dateFormat} from '@/utils/index'
  export default{
    data() {
      return {
        stateLoading:false,
        type:this.$route.query.type,
        formInline:{
		  receiveDate:'',
		  receiveOpinion:'',//接收意见
		  receiveStatus:'1',//是否接收
          dataType:'0',
          leader:'',
          auditor:'',
          reporter:'',
          reportDate:'',
          orgCode:sessionStorage.getItem("orgCode"),
          period:'',
          sskdbm:sessionStorage.getItem("tyshxydm")+'001',
          sskdmc:sessionStorage.getItem("orgName"),
          operationType:'',
		  summaryStatus:0,
		  isDelete:0,
          detailList:[
            {
              pzmc:'储备粮油合计',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'一、粮食',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'(一)小麦',
              pzbm:'1110000',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'1. 国产小麦',
              pzbm:'1111000',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'其中：硬白麦',
              pzbm:'1111006',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'软白麦',
              pzbm:'1111009',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'硬红麦',
              pzbm:'1111007',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'软红麦',
              pzbm:'1111010',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'2.进口小麦',
              pzbm:'9990000',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'其中：美麦',
              pzbm:'1112005',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'加麦',
              pzbm:'1112003',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'澳麦',
              pzbm:'1112001',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'(二)大米',
              pzbm:'2360000',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'(三)稻谷',
              pzbm:'1130000',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'其中:本地储存',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'异地储存',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'(四)面粉',
              pzbm:'2310000',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'其中:包存',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'罐存',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'二、食用油',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'(一)大豆原油',
              pzbm:'1410000',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'(二)成品大豆油',
              pzbm:'2120000',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'其中：一级',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'二级',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            },
            {
              pzmc:'三级',
              pzbm:'',
              initial:null,
              incomeTotal:null,
              purchase:null,
              otherIncome:null,
              expenseTotal:null,
              sale:null,
              loss:null,
              otherExpense:null,
              ending:null,
            }
          ],
        }
      }

    },
    created(){
      if(this.$route.query.id){
        this.getJxcInfo()
      }else{
        // this.GetPeriod()
      }

    },
    methods:{
      cancelClick(){
        this.$router.push({
          name: "storageFee",
		  query: { searchShowMoreBool:this.$route.query.searchShowMoreBool }
        });
      },

      saveZc(type,formName,shtype,sussInfo,errInfo){
        console.log('66555-==============')
        this.shtype=shtype
        if(sussInfo == '盖章成功！'){
          this.formInline.signatureStatus=type
        }else{
          this.formInline.operationType=type
        }
		if(this.shtype == 4){
			var data={
				...this.formInline,
				receiveDate:'',
			}
		}else{
			var data={
				...this.formInline,
			}
		}
		
		
		// if(shtype == 4){
		// 	this.formInline.receiveDate=''
		// }
        this.$refs[formName].validate((valid) => {
          if (valid) {
            if(this.$route.query.id){
              // console.log(this.formInline,'ooiyy7778-----')
              purchaseStockUpdate(data,this.shtype).then(res =>{
                if(res.infoCode == 200){
                  this.$message({
                    message: "提交成功",
                    type: "success",
                  });
                  this.$router.push({
                    name: "storageFee",
                  });
                }else{
                  this.$message.error(res.msg);
                }
              })
            }else{
              // console.log(this.formInline,'ooiyy7778----+++++++++++++-')
              reserveReportSave(data).then(res =>{
                if(res.infoCode == 200){
                  this.$message({
                    message: "保存成功",
                    type: "success",
                  });
                  this.$router.push({
                    name: "storageFee",
					query: { searchShowMoreBool:this.$route.query.searchShowMoreBool }
                  });
                }else{
                  this.$message.error(res.msg);
                }
              })
            }
          }
        })

      },
      getJxcInfo(){
        var data={
          psId:this.$route.query.id
        }
        reserveReportInfo(data).then(res =>{
          if(res.infoCode == 200){
            this.formInline=res.data.data
			if(this.type == 'js'){
				this.formInline.receiveOpinion=''
				this.formInline.receiveDate=dateFormat(new Date())
				this.formInline.receiver=sessionStorage.getItem("userName")
				this.formInline.receiveStatus=1
			}
            if (this.formInline.signature) {
              if (this.formInline.signature.indexOf("newSeal") == -1) {
                this.$nextTick(() => {
                  this.$ShowSeal("grainsubsidy", 1);
                  this.$SetSealData(this.formInline.signature, 0, "lingdao", 1);
                });
              } else {
                this.$signatureOnload(
                  "grainsubsidy",
                  this.formInline.signature.substring(7)
                );
              }
            }
          }
        })
      },
    }
  }
</script>

<style scoped lang="scss">
.recordsDetailsTable{
    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{
    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;
 }
</style>
<style>
  #grainsubsidy {
    position: relative !important;
  }

  #grainsubsidy > div {
    left: 0px !important;
    top: -40px !important;
  }
</style>
