<template>
<!-- 电子借阅车 -->
  <el-dialog v-dialogDrag ref="diaFrom" :title="'电子借阅车'" :close-on-click-modal="false"
    :visible.sync="visible" width="40%" top="10px" :before-close="cancel">
    <el-form :model="borrowForm" ref="batchBorrowRef" label-width="100px" :rules="rules">
      <el-form-item label="申请人：">
        <el-input clearable size="mini" disabled v-model="borrowForm.applyUserName" :title="borrowForm.applyUserName"></el-input>
      </el-form-item>
      <el-form-item label="申请日期：">
        <el-date-picker size="mini" disabled v-model="borrowForm.applyTime" format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="选择日期时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="申请档案数量">
        <el-input clearable disabled size="mini" placeholder="请输入内容" v-model="borrowForm.rec_nums"></el-input>
      </el-form-item>
      <el-form-item label="到期日期：" prop="returnDate">
        <el-date-picker style="width:100%" :picker-options="pickerOptions" size="mini" v-model="borrowForm.returnDate"
          type="date" placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
      </el-form-item>
      <el-form-item label="利用形式：" prop="useStyle">
        <el-select style="width:100%" clearable v-model="borrowForm.useStyle" size="mini">
          <el-option label="查看" value="view"></el-option>
          <el-option label="打印" value="print"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="申请理由：" prop="applyReason">
        <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="borrowForm.applyReason">
        </el-input>
      </el-form-item>
      <el-form-item label=" ">
        <el-button  @click="submit('batchBorrowRef')" type="primary" size="mini">确定
        </el-button>
        <el-button @click="cancel" type="info" size="mini">取消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>
<script>
import { submitApply } from "@/api/archives-management/fileManagement/notStoredArchives.js";
import { message,getCurrentTime} from "@/utils/common";
import { mapState } from "vuex";
export default {
  props: {
    visible: {
      type: Boolean,
      default: () => false,
    },
    currentRowCheckedItem:{
        type:Array,
        default:()=>[]
    },
    borrowForm:{
      type:Object,
      default:()=>{}
    }
  },
  watch:{
    'currentRowCheckedItem':function(v){
        console.log(v)
        this.applyNumberArr = v;
        this.borrowForm.rec_nums = this.applyNumberArr.length;
    }
  },
  data() {
    return {
        applyNumberArr:[],
      btnLoading: false,
      rules: {
        returnDate: [
          {
            required: true,
            message: "请选择到期日期",
            trigger: "change",
          },
        ],
        useStyle: [
          {
            required: true,
            message: "请选择利用方式",
            trigger: "change",
          },
        ],
        applyReason: [
          {
            required: true,
            message: "请输入借阅理由",
            trigger: "blur",
          },
        ],
      },

      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now();
        },
      },
      options: [],
      value: [],
    };
  },
  computed: {
    ...mapState({
      EchoList: (state) => state.userRole.EchoList,
    }),
  },
  methods: {
    cancel() {
        this.$refs['batchBorrowRef'].resetFields(); 
        this.$emit("cancel");
    },
    submit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
         // this.btnLoading = true;
            this.$emit("clickSubmit",this.borrowForm)
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    getQuanzongList() {
      console.log("初始化");
      this.$nextTick(() => {
        this.options = this.EchoList.map((item, index) => {
          return {
            fondsname: item.fondsname,
            fondscode: item.fondscode,
            id: item.fondscode,
          };
        });
      });
      this.value = [];
      this.EchoList.forEach((item, index) => {
        this.$nextTick(() => {
          this.value.push(item.fondsname);
        });
      });
      console.log(this.options, this.value);
    },
  },
  created() {
    
  },
  mounted() {
    //this.getQuanzongList();    
  },
};
</script>
