<script src="../../../api/basic/sysApprovalFlow.js"></script>
<template>
  <div>
    <el-form :model="formData" ref="dataForm" label-width="100px">
      <el-row type="flex" justify="end">
        <el-button-group style="display: flex;margin-bottom: 15px; margin-right: 50px;margin-top: -5px">
          <el-button
            v-show="!this.sysApprovalFlowConfig"
            type="primary"
            @click.native="saveOrder('3')"
            :loading="passLoading"
          >审核通过
          </el-button
          >
          <el-button
            v-show="!this.sysApprovalFlowConfig"
            type="primary"
            @click.native="saveOrder('4')"
            :loading="noPassLoading"
          >审核拒绝
          </el-button
          >
          <el-button
            v-show="this.sysApprovalFlowConfig"
            type="primary"
            @click.native="showApprovalFlowDetail()"
          >审核过程
          </el-button>

        </el-button-group>
      </el-row>
      <el-card style="margin-top: -5px;">
        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item prop="billNo" label="单据号:">
              <el-input v-model="formData.billNo" auto-complete="off" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item prop="createTime" label="创建日期:">
              <el-date-picker
                :disabled="true"
                v-model="formData.createTime"
                type="datetime"
                placeholder="选择日期"
                style="width: 100%"
                :clearable="false"
                value-format="yyyy-MM-dd HH:mm:ss"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item prop="invCode" label="领用仓库:">
              <el-input v-model="formData.invName" auto-complete="off" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item class="query-form-item" prop="targetInvCode" label="往来信息:">
              <el-input v-model="formData.targetInvName" auto-complete="off" :disabled="true"></el-input>
            </el-form-item>
          </el-col>

        </el-row>
        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item prop="remark" label="领用备注:">
              <el-input v-model="formData.remark" auto-complete="off" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item prop="remark" label="审核说明:">
              <el-input v-model="formData.auditRemark" auto-complete="off"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
      <el-card>
        <el-table v-loading="loading" :data="codeArray" style="width: 100%;" border max-height="300" height="300"
                  ref="multipleTable">
          <el-table-column label="序号" type="index" width="50"></el-table-column>
          <el-table-column label="药品通用名" prop="cpmctymc" show-overflow-tooltip></el-table-column>
          <el-table-column label="规格型号" prop="ggxh" show-overflow-tooltip></el-table-column>
          <el-table-column label="单据数量" prop="count" show-overflow-tooltip></el-table-column>
          <el-table-column label="批准文号" prop="zczbhhzbapzbh" show-overflow-tooltip></el-table-column>
          <el-table-column label="生产企业" prop="ylqxzcrbarmc" show-overflow-tooltip></el-table-column>
        </el-table>
      </el-card>
    </el-form>

    <el-dialog
      title="审批详情"
      :visible.sync="approvalFlowDetailVisible"
      width="80%"
      v-if="approvalFlowDetailVisible"
      @close='closeDialog'
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :before-close="handleClose"
    >
      <approvalFlowDetail
        :isChang="true"
        :closeDialog="closeDialog"
        :idQuery="idQuery"
      ></approvalFlowDetail>
    </el-dialog>


  </div>
</template>

<script>
import approvalFlowDetail from "@/components/ApprovalFlow/index";
import dialogInvProduct from "./DialogSelectInvProduct";
import {getAudit, getOrderDetail} from "@/api/pharmaceuticals/receiveDrugOrder";
import {getSysApprovalFlowConfig} from "@/api/basic/sysApprovalFlow";

export default {
  name: "idQuery",
  props: {
    closeDialog: {
      type: Function,
      required: true,
    },
    idQuery: {
      type: Object,
      required: true,
    },
    formData: {
      invCode: null,
      targetInvCode: null,
      billNo: null,
      createTime: "",
      billType: "",
      approvalFlowId: ""
    },
    codeArray: [],
  },
  data() {
    return {
      idQuery: {},
      sysApprovalFlowConfig: false,
      approvalFlowDetailVisible: false,
      showSearch: true,
      code: "",
      query: {
        orderIdFk: "",
        page: 1,
        limit: 10,
      },
      passLoading: false,
      noPassLoading: false,
    };
  },
  components: {
    dialogInvProduct,approvalFlowDetail
  },
  methods: {
    getConfig(){
      getSysApprovalFlowConfig().then((response) => {
        this.sysApprovalFlowConfig = response.data;
      }).catch(() => {
      });
    },
    // closeDialog() {
    //   this.approvalFlowDetailVisible = false;
    // },
    handleClose() {
      this.approvalFlowDetailVisible = false;
    },
    showApprovalFlowDetail() {
      this.idQuery = this.formData
      this.approvalFlowDetailVisible = true;
    },
    hideSearch() {
      this.showSearch = !this.showSearch;
    },
    handleDetail() {
      var query = {};
      query.orderIdFk = this.formData.billNo;
      getOrderDetail(query) //查找该单号下的所有条码
        .then((response) => {
          this.codeArray = response.data.list || [];
        })
        .catch(() => {
          this.codeArray = [];
        });
    },
    saveOrder(val) {
      var data = {
        id: this.formData.id,
        billNo: this.formData.billNo,
        status: val,
        auditRemark: this.formData.auditRemark
      };
      if (val == '3'){
        //审核通过btn
        this.passLoading = true
      }else {
        //审核拒绝
        this.noPassLoading = true
      }
      getAudit(data).then((res => {
        if (val == '3'){
          this.passLoading = false
        }else {
          this.noPassLoading = false
        }
        if (res.code == 20000) {
          this.closeDialog();
        } else {
          this.$message.error(res.message);
        }
      }))
      this.closeDialog()
    }
  },
  filters: {},
  mounted() {
  },
  created() {
    // console.log(this.idQuery)
    this.formData = this.idQuery;
    this.handleDetail();
    this.getConfig();
  },
};
</script>
<style scoped>

.ao-text {
  width: 100%;
  font-size: 13px;
  font-family: "Microsoft YaHei";
  float: right;
  text-align: right;
  margin-top: 10px;
}

</style>



