<!--
 * @Author: zhp
 * @Date: 2023-11-06 15:15:30
 * @LastEditTime: 2024-03-15 14:33:12
 * @LastEditors: zhp
 * @Description:
-->
<template>
  <el-dialog :visible.sync="visible" width="50%">
    <small-title slot="title" :no-padding="true">
      {{ '详情' }}
    </small-title>
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
      label-width="auto">
      <el-row :gutter="24">
        <el-col :span="8">
          <el-form-item label="工单号" prop="workOrderId">
            <el-select disabled v-model="dataForm.workOrderId" placeholder="请选择工单号">
              <el-option v-for="dict in workOrderList" :key="dict.id" :label="dict.name" :value="dict.id" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="数量" prop="num">
            <el-input disabled v-model="dataForm.num" placeholder="请输入数量" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="报废时间" prop="logTime">
            <el-date-picker disabled v-model="dataForm.logTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="8">
          <el-form-item label="产线" prop="lineId">
            <el-select disabled v-model="dataForm.lineId" placeholder="请选择产线" @change="getWorksectionById">
              <el-option v-for="dict in lineList" :key="dict.id" :label="dict.name" :value="dict.id" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="工段" prop="sectionId">
            <el-select v-model="dataForm.sectionId" placeholder="请选择工段" disabled>
              <el-option v-for="dict in sectionList" :key="dict.id" :label="dict.name" :value="dict.id" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="报废原因" prop="detId">
            <el-select v-model="dataForm.detId" placeholder="请选择报废原因" multiple disabled>
              <el-option v-for="dict in detList" :key="dict.id" :label="dict.name" :value="dict.id" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="8">
          <el-form-item label="描述" prop="description">
            <el-input v-model="dataForm.description" placeholder="请输入描述" disabled />
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="备注" prop="remark">
            <el-input v-model="dataForm.remark" placeholder="备注" disabled />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </el-dialog>

</template>

<script>
import basicAdd from './basic-add';
import {
  createQualityScrapLog, updateQualityScrapLog, getQualityScrapLog, getWorkOrderList,
  getTeamList, getDetList,getLineList } from "@/api/base/qualityScrapLog";
import { getList,} from "@/api/base/qualityScrapType";
import SmallTitle from './SmallTitle';
export default {
  components: {
    SmallTitle,
  },
	mixins: [basicAdd],
	data() {
		return {
			urlOptions: {
			  isGetCode: false,
        // codeURL: getCode,
        createURL: createQualityScrapLog,
        updateURL: updateQualityScrapLog,
        infoURL: getQualityScrapLog,
      },
      lineList:[],
      typeList: [],
      workOrderList: [],
      detList:[],
      teamList: [],
      sourceList: [
        {
          id: 1,
          name: '手动',
        },
        {
          id: 2,
          name: '自动',
        }
      ],
      sectionList:[],
      visible:false,
			dataForm: {
        id: undefined,
        logTime: undefined,
        source:1,
        detId: undefined,
        workOrderId: null,
        teamId: undefined,
        num: undefined,
        lineId:undefined,
        description:undefined,
        // description: undefined,
        remark: undefined,
			},
			// materialList: [],
			dataRule: {
				// materialId: [{ required: true, message: "", trigger: "blur" }],
        workOrderId: [{ required: true, message: "工单号不能为空", trigger: "change" }],
        num: [{ required: true, message: "数量不能为空", trigger: "blur" }],
        detId: [{ required: true, message: "报废原因不能为空", trigger: "change" }],

        logTime: [{ required: true, message: "报废时间不能为空", trigger: "change" }],
      }
		};
	},
	mounted() {
		this.getDict()
    console.log('我看看', this.dataForm)
    // this.getCurrentTime()
	},
  methods: {
    // init() {
    //   this.dialogVisible = true
    // },
    // getCurrentTime() {
    //   // new Date().Format("yyyy-MM-dd HH:mm:ss")
    //   this.dataForm.logTime = new Date()
    //   // this.dataForm.logTime = year + "-" + month + "-" + day;
    //   console.log(this.dataForm.logTime);
    // },
    async getDict() {
      // 物料列表
      const res = await getList()
      this.typeList = res.data
      getWorkOrderList().then((res) => {
        console.log(res);
        // console.log(response);
        this.workOrderList = res.data.map((item) => {
          return {
            name: item.name,
            id: item.id
          }
        })
        // console.log(this.formConfig[0].selectOptions);
        // this.listQuery.total = response.data.total;
      })
      getLineList().then((res) => {
        console.log(res);
        // console.log(response);
        this.lineList = res.data.map((item) => {
          return {
            name: item.name,
            id: item.id
          }
        })
        // console.log(this.formConfig[0].selectOptions);
        // this.listQuery.total = response.data.total;
      })
      getDetList().then((res) => {
        console.log(res);
        // console.log(response);
        this.detList = res.data.map((item) => {
          return {
            name: item.content,
            id: item.id
          }
        })
        // console.log(this.formConfig[0].selectOptions);
        // this.listQuery.total = response.data.total;
      })
      getTeamList().then((res) => {
        console.log(res);
        // console.log(response);
        this.teamList = res.data.map((item) => {
          return {
            name: item.name,
            id: item.id
          }
        })
        // console.log(this.formConfig[0].selectOptions);
        // this.listQuery.total = response.data.total;
      })
    },
    async getWorksectionById(lineId) {
      if (lineId) {
        const { code, data } = await this.$axios({
          url: '/base/core-workshop-section/listByParentId',
          method: 'get',
          params: {
            id: lineId,
          },
        });
        if (code == 0) {
          console.log(data)
          this.sectionList = data.map((item) => {
            return {
              name: item.name,
              id: item.id,
            };
          });
        }
      } else {
        this.$axios({
          url: '/base/core-workshop-section/listAll',
          method: 'get',
          // params: {
          //   id: lineId,
          // },
        }).then((res) => {
          // console.log(data)
          this.sectionList = res.data.map((item) => {
            return {
              name: item.name,
              id: item.id,
            };
          });
        })
      }
    },
	},
};
</script>
