<template>
  <!-- 仓储设备投资建设上报 -->
  <div class="content-main">
    <el-form :inline="true" :model="formInline" ref="formInline" class="demo-form-inline">
      <el-row>
		  <el-form-item label="年份:">
		    <el-date-picker v-model="formInline.sbnf" value-format="yyyy" type="year" @change="changeYear"
		        placeholder="请选择年份"></el-date-picker>
		  </el-form-item>
		  <el-form-item v-show="!hzDisable && orgCode=='LS001'" label="区域:" prop="ssqymc">
		    <el-input
		      clearable
		      class="inputCompatible"          
		      v-model="formInline.ssqymc"
		      placeholder="区域"
		    ></el-input>
		  </el-form-item>
		  <el-form-item v-show="!hzDisable && orgCode=='LS001'" label="库区名称:" prop="sskdmc">
		    <el-input
		      clearable
		      class="inputCompatible"        
		      v-model="formInline.sskdmc"
		      placeholder="库区名称"
		    ></el-input>
		  </el-form-item>
		<div class="search-button">
		  <span class="search-line"></span>
		  <div v-if="!hzDisable && orgCode=='LS001'" class="search-select" @click="searchShowMoreBool = !searchShowMoreBool">
		    更多条件
		    <i class="el-icon-arrow-up" v-show="searchShowMoreBool"></i>
		    <i class="el-icon-arrow-down" v-show="!searchShowMoreBool"></i>
		  </div>
		  <el-button
		    type="primary"
		    size="small"
		    class="iconfont iconchaxun"
		    @click="GetList"
		  >查询</el-button>
		  <el-button
		    type="primary"
		    @click="resetFun('formInline')"
		    size="small"
		    class="iconfont iconzhongzhi"
		  >重置</el-button>
		</div>   
	  </el-row>
	 <el-row v-show="searchShowMoreBool && !hzDisable && orgCode=='LS001'">
	   <el-form-item label="设备器材类型:" prop="sblx">
	     <el-select  clearable  class="inputCompatible" @change="Changesblx"  v-model="formInline.sblx"   placeholder="请选择">
	       <el-option
	         v-for="item in sblxOptions"
	         :key="item.label"
	         :label="item.label"
	         :value="item.label"
	       ></el-option>   
	     </el-select>
	   </el-form-item>
	   <el-form-item label="设备器材类别:" prop="sbyjlb">
	     <el-select  clearable  class="inputCompatible"  v-model="formInline.sbyjlb"   placeholder="请选择">
	       <el-option
	         v-for="item in sblbOptions"
	         :key="item.sblb"
	         :label="item.sblb"
	         :value="item.sblb"
	       ></el-option>   
	     </el-select>
	   </el-form-item>
	   <el-form-item label="设备器材名称:" prop="sbmc">
	     <el-input
	       clearable
	       class="inputCompatible"        
	       v-model="formInline.sbmc"
	       placeholder="设备器材名称"
	     ></el-input>
	   </el-form-item>
	 </el-row>
      <!-- <el-form-item style="border-left:1px dashed #006bd5;padding-left:15px">
        <el-button type="primary" size="small" class="iconfont iconchaxun" @click="GetList">查询</el-button>
        <el-button
          type="primary"
          size="small"
          class="iconfont iconzhongzhi"
          @click="resetFun"
        >重置</el-button>
      </el-form-item> -->
    </el-form>
    <el-row style="background: rgb(237, 245, 253); line-height: 50px;margin-bottom: 10px;">
      <el-button
        type="primary"
        class="iconfont"
        size="small"
        @click="GetHzbList('add')"
      >汇总表</el-button>
      <el-button
        type="primary"
        class="iconfont"
        size="small"
        @click="GetSbMxList('add')"
      >设备投资明细表</el-button>
      <el-button
        type="primary"
        class="iconfont icondaochu11"
        size="small"
        @click="exportXls('add')"
      >导出</el-button>
    </el-row>
    <ccssComponent
    v-show="hzDisable"
      ref="ccssComponentS"
    ></ccssComponent>
    <ccsbtzmxCompont v-show="!hzDisable" ref="ccssComponenMx"></ccsbtzmxCompont>
   <!-- <div class="footer" style="text-align: center;padding-top: 5px;">
      <el-button type="primary" @click="confirmReporting()">确认上报</el-button>
    </div> -->
  </div>
</template>

<script>
	import { querySbqclb } from '@/api/zgsq/ccsbtzmx'
	import ccssComponent from "./ccssComponent.vue";
  import ccsbtzmxCompont from "./ccsbtzmxCompont.vue"
  export default {
	  components: { ccssComponent,ccsbtzmxCompont },
    data() {
      return {
		  searchShowMoreBool:false,
        hzDisable:true,
		orgCode:sessionStorage.getItem('orgCode'),
        formInline:{
          sbnf:new Date().getFullYear().toString(),
		  ssqymc:'',
		  kqmc:'',
		  sblx:'',
		  sbyjlb:'',
		  sbmc:'',
        },
		sblxOptions:[
			{
				// value:'粮食设备',
				label:'粮食设备',
			},
			{
				// value:'仓储器材',
				label:'仓储器材',
			}
		],
		sblbOptions:[],
      }
    },
    created() {
      // this.getTableData();
    },
	mounted() {
    this.GetHzbList()
	  // this.$refs.ccssComponentS.getList();
	},
    methods: {
		//导出
		exportXls(){
			if(this.hzDisable){
				var data={
				 orgCode:sessionStorage.getItem('orgCode'),
				 sbnf:this.formInline.sbnf
				}
				this.$refs.ccssComponentS.exportExcel(data);
			}else{
				var data={
				   orgCode:sessionStorage.getItem('orgCode'),
						 ...this.formInline
				}
				this.$refs.ccssComponenMx.exportExcel(data);
			}
		},
		Changesblx(val){
			this.formInline.sbyjlb=''
			this.GetSblb(val)
		},
	  GetSblb(val){
		  var data={
			  sblxCode:val
		  }
		  querySbqclb(data).then(res =>{
			  if(res.infoCode == 200){
				 this. sblbOptions=res.data
			  }
		  })
	  },
      //查询
      GetList(){
        if(this.hzDisable){
          this.GetHzbList()
        }else{
          this.GetSbMxList()
        }
      },
      //重置
      resetFun(formName){
		   this.$refs[formName].resetFields();
        this.formInline.sbnf=new Date().getFullYear().toString()
        if(this.hzDisable){
          this.GetHzbList()
        }else{
          this.GetSbMxList()
        }
      },
		GetHzbList() {
			this.searchShowMoreBool=false
            this.hzDisable=true
            var data={
             orgCode:sessionStorage.getItem('orgCode'),
             sbnf:this.formInline.sbnf
            }
            this.$refs.ccssComponentS.init(data);
		},
    GetSbMxList(){
      this.hzDisable=false
      var data={
            orgCode:sessionStorage.getItem('orgCode'),
			...this.formInline
             // sbnf:this.formInline.sbnf
          }
      this.$refs.ccssComponenMx.init(data);
    },
      // 选中事件
      changeYear() {
        console.log("changeYear:", this.nf);
      },
      confirmReporting() {
        this.$confirm("是否确认上报数据?", "提示", {
          closeOnClickModal: false,
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          this.$message.success("上报成功");
        }).catch((err) => {
          this.$message.error(err);
        });
      }
    }
  }
</script>

<style scoped>
  .spanStyle {
    font-size: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .spanStyleRight {
    display: flex;
    justify-content: right;
    align-items: right;
  }
</style>
