<template>
  <div>
    <el-card>
      <div slot="header" class="clearfix">
        <span>采购申请基本信息</span>
      </div>
      <el-form ref="form" :model="infoForm" :rules="rules" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="标题">
              <el-input v-model="infoForm.purchaseName" readonly></el-input>
            </el-form-item>
            <el-form-item label="预算项目">
              <el-input v-model="infoForm.budgetName" readonly></el-input>
            </el-form-item>
            <el-form-item label="采购费用(元)">
              <el-input v-model="infoForm.purchaseMoney" readonly></el-input>
            </el-form-item>
            <el-form-item label="申请时间">
              <el-input v-model="infoForm.applyTime" readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="期望日期">
              <el-input v-model="infoForm.expectedDate" readonly></el-input>
            </el-form-item>
            <el-form-item label="申请部门">
              <el-input v-model="infoForm.deptName" readonly></el-input>
            </el-form-item>
            <el-form-item label="申请人">
              <el-input v-model="infoForm.applyUser" readonly></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-table :data="purchaseList" style="width: 100%">
        <el-table-column type="index" label="序号" width="48"></el-table-column>
        <el-table-column prop="assetsTypeName" label="资产分类" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.assetsTypeName }}</span>

          </template>
        </el-table-column>
        <el-table-column prop="assetsName" label="资产名称" align="center">
          <template slot-scope="{ row }">
            <span>{{ row.assetsName }}</span>

          </template>
        </el-table-column>
        <el-table-column prop="assetsSpecs" label="规格型号">
          <template slot-scope="{ row }">
            <span>{{ row.assetsSpecs }}</span>

          </template>
        </el-table-column>
        <el-table-column prop="assetsUnit" label="单位" align="center">
          <template slot-scope="{ row }">
            <span>{{ row.assetsUnit }}</span>

          </template>
        </el-table-column>
        <el-table-column prop="assetsPrice" label="单价-元" align="center">
          <template slot-scope="{ row }">
            <span>{{ row.assetsPrice }}</span>

          </template>
        </el-table-column>
        <el-table-column prop="assetsNumbers" label="数量" align="center">
          <template slot-scope="{ row }">
            <span>{{ row.assetsNumbers }}</span>

          </template>
        </el-table-column>
        <el-table-column prop="totalPrice" label="小计" align="center">
          <template slot-scope="{ row }">
            <span>{{ row.assetsPrice * row.assetsNumbers }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="remark" label="备注" align="center">
          <template slot-scope="{ row }">
            <span>{{ row.remark }}</span>

          </template>
        </el-table-column>
      </el-table>
    </el-card>
    <TaskResolve v-if="!$attrs.readOnly" :taskId="this.$attrs.taskId" :instanceId="instanceId" :id="id"
      v-on="this.$listeners"></TaskResolve>

  </div>
</template>

<script>
import { purchaseApprovalDetail } from "@/api/smartSchool/indexMould/myTask/teacherLeaveInfo";
import TaskResolve from "@/views/smartSchool/indexMould/myTask/purchaseApproval/components/TaskResolve.vue"

export default {
  name: "StudentLeaveInfo",
  dicts: ['biz_leave_type', 'course_num'],
  components: { TaskResolve },
  props: {
    id: {
      type: [String, Number],
      default: ''
    },
    row: {},
    instanceId: {
      type: [String, Number],
      default: ''
    },

  },
  data() {
    const limitStartTime = {
      disabledDate: time => {
        if (this.infoForm.realityEndTime) {
          return Date.parse(time) > Date.parse(this.infoForm.realityEndTime);
        }
        return false;
        // return Date.parse(time) < Date.parse(new Date());
      }
    };
    const limitEndTime = {
      disabledDate: time => {
        if (this.infoForm.realityStartTime) {
          return Date.parse(time) < Date.parse(this.infoForm.realityStartTime);
        }
        return false;
      }
    };
    return {
      purchaseList: [],
      disable: true,
      limitEndTime,
      limitStartTime,
      infoForm: {},
      form: {},
      rules: {
        realityStartTime: [
          { required: true, message: '实际开始时间不能为空', trigger: 'change' }
        ],
        realityEndTime: [
          { required: true, message: '实际结束时间不能为空', trigger: 'change' }
        ]
      },

    }
  },
  created() {
    this.getDetailInfo();
  },
  methods: {
    /** 获取详情 */
    getDetailInfo() {
      purchaseApprovalDetail(this.id).then(res => {
        this.infoForm = res.data
        this.purchaseList = res.data.list
      })
    },

    /** 销假 */
    // handleRevoke() {
    //   this.$refs.form.validate(valid => {
    //     if (valid) {
    //       this.$modal.loading('正在销假，请稍等...');
    //       cancelLeave(this.$attrs.taskId, this.infoForm).then(response => {
    //         this.$modal.closeLoading();
    //         this.$message.success('销假成功');
    //         this.$emit('submit');
    //       }).catch(error => {
    //         this.$modal.closeLoading();
    //       })
    //     }
    //   })
    // }
  }
}
</script>

<style scoped></style>
