<template>
  <div class="mainContentBox">
    <avue-crud
      ref="crudRef"
      v-model:search="search"
      v-model="form"
      :data="data"
      :option="option"
      v-model:page="page"
      @row-save="createRow"
      @row-update="updateRow"
      @row-del="deleteRow"
      @search-change="searchChange"
      @search-reset="resetChange"
      @size-change="dataList"
      @current-change="dataList"
      @selection-change="selectionChange"
    >

      <!--        <single-upload v-model="form.drawingPath" :generatePdf="true"/>-->
        <template #menu-left="{ size }">
            <el-button type="primary" icon="el-icon-plus" @click="getDocumentList" v-if="props.status == 1"
                >绑定领料单</el-button
                >
          <el-button
              :disabled="toDeleteIds.length < 1"
              type="danger"
              v-if="props.status == 1"
              icon="el-icon-delete"
              :size="size"
              @click="multipleDelete"
          >删除</el-button
          >
        </template>
        <template #menu="{ size,row,index }">
            <el-button type="primary" icon="el-icon-view" link @click="details(row)"
            >查看明细</el-button
            >
        </template>
    </avue-crud>
  </div>
    <el-dialog
            v-model="dialog2.visible"
            :title="dialog2.title"
            width="900px"
            @close="dialog2.visible=false"
            :destroy-on-close="true"

    >
        <el-form
                 ref="documentForm"
                 label-width="auto"
                 style="max-width: 900px;min-height: 200px;margin-top: 20px"
                 :model = "documentForm2"
                 :rules="rules">
          <el-form-item prop="docNos" label="领用单号">
            <el-select
                    v-model="documentForm2.docNos"
                    multiple
                    filterable
                    placeholder="选择领用单号"
                    style="width: 500px"

            >
                <el-option
                        v-for="item in documentLists"
                        :key="item"
                        :label="item"
                        :value="item"
                />
            </el-select>
          </el-form-item>
          <el-form-item style="margin-left: 45%;margin-top: 150px">
            <el-button
              type="primary"
              @click="saveDocument"
            >保存</el-button
            >
              <el-button
                      @click="cancelDialog"
              >取消</el-button
              >
          </el-form-item>
        </el-form>
    </el-dialog>
    <el-dialog
            v-model="dialog3.visible"
            :title="dialog3.title"
            width="900px"
            @close="dialog3.visible=false"
            :destroy-on-close="true"
    >

        <el-table :data="tableList" style="width: 100%" ref="singleTableRef" >
            <el-table-column type="index" width="50" />
            <el-table-column prop="productName" label="物料名称" />
            <el-table-column prop="productModel" label="物料规格"  />
            <el-table-column prop="batchNo" label="批次号" />
            <el-table-column prop="bomRemark" label="BOM备注"  />
            <el-table-column prop="supplyNum" label="应发数量"  />
            <el-table-column prop="actualNum" label="实发数量"  />
        </el-table>
        <template #footer>
            <div class="footer">
                <el-button @click="dialog3.visible=false">关闭</el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script setup>
import { useCrud } from "@/hooks/userCrud";
import dictDataUtil from "@/common/configs/dictDataUtil";
import ButtonPermKeys from "@/common/configs/buttonPermission";
import { useCommonStoreHook, useDictionaryStore } from "@/store";
import SingleUpload from "@/components/Upload/SingleUpload.vue";
import { getUserList } from "@/api/system/user";
import { ref } from "vue";
import FilesUpload from "@/components/Upload/FilesUpload.vue";
import {documentAdd, documentDetail, documentList} from "@/api/rework";
const dialog2 = ref({
    title: "领料单号",
    visible: false,
});
const singleTableRef = ref({});
const dialog3 = ref({
    title: "领料单号明细",
    visible: false,
});
const documentForm2=ref({}
);
const rules = reactive({
    docNos: [{ required: true, message: "领用单号不能为空", trigger: "blur" }],
});
const docNo = ref([]);
const deatailDoc =ref(
    {}
);
const tableList =ref([]);
const details = (row) =>{
    deatailDoc.value.orderCode = props.orderCode;
    deatailDoc.value.docNo = row.docNo;
    documentDetail(deatailDoc.value).then(
        (data)=>{
            if(data.data){
                tableList.value = data.data.lineList;
                dialog3.value.visible=true;
            }

        }
    )
}
const saveDocument = () =>{
    documentForm.value.validate((isValid, invalidFields) => {
        if (isValid) {
            documentForm2.value.recordId = props.recordId;
            documentAdd(documentForm2.value).then(
                (data)=>{
                    if(data.code==="200"){
                        dialog2.value.visible=false;
                        dataList();
                    }
                }
            )
        }
    })
}
// 数据字典相关
const { dicts } = useDictionaryStore();
const userList = ref([]);
const documentForm = ref("documentForm");

// 传入一个url，后面不带/
const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
  useCrud({
    src: "/api/v1/reworkDocument",
  });
const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
  Methords; //增删改查
const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
const filePath = import.meta.env.VITE_APP_UPLOAD_URL;
const crudRef = ref(null); //crudRef.value 获取avue-crud对象
const cancelDialog = () =>{
    dialog2.value.visible =false;
}
const props = defineProps({
  recordId: {
    type: String,
    default: () => {
      return 0;
    },
  },
  dialog: {
    type: Object,
    default: () => {
      return {};
    },
  },
  orderCode: {
    type: String,
    default: () => {
      return 0;
    },
  },
  status: {
    type: Number,
    default: () => {
      return 0;
    },
  },
});

const srcList = ref([]);
const fileNameList = ref([]);
const testFiles = () => {
  form.value.drawingPathList = srcList.value;
  form.value.fileNameList = fileNameList.value;
};
const documentLists =ref([]);
const getDocumentList = () =>{
    documentList(props.orderCode).then(
        (data)=>{
            if(data.code==='200'){
                documentLists.value = data.data.map(item=>item.docNo);
                dialog2.value.visible=true;
            }
        }
    )
}
onMounted(() => {
  search.value.recordId = props.recordId;
  dataList();
});

// 设置表格列或者其他自定义的option
option.value = Object.assign(option.value, {
  searchEnter: true,
  selection: true,
  addBtn: false,
  editBtn: false,
  viewBtn: false,
  delBtn: false,
  column: [
    {
      label: "领用单号",
      prop: "docNo",
      search: true,
    },
  ],
});
</script>
