<template>
    <el-form :model="formData" ref="formref" label-position="right" :rules="rules" label-width="172px"
        :disabled='!props.formData.saveBtnShow' style="padding: 0;">

        <!--   :disabled='formData.id' -->
        <el-form-item label="起重机械类别:" prop="sblx">
            <MOSTY.DictTree v-model="formData.sblx" :zdlist="sbsslist" :placeholder='"请选择起重机械类别"' :type='"array"'
                style="width: 337px;" @nameChange='getxzqh' />
        </el-form-item>
        <el-form-item label="设备型号:" prop="sbxh">
            <el-input v-model="formData.sbxh" style="width: 337px" />
        </el-form-item>
        <el-form-item label="起重量:" prop="liftingCapacity">
            <el-input v-model.number="formData.liftingCapacity" type="number" style="width: 337px">
                <template #append>吨</template>
            </el-input>
        </el-form-item>
        <el-form-item label="制造日期:" prop="zzny">
            <el-date-picker v-model="formData.zzny" style="width: 337px" type="date" value-format="YYYY-MM"
                placeholder="请选择制造日期" :disabled-date="disablednowDate1" />
        </el-form-item>
        <el-form-item label="制造单位:" prop="zzdw">
            <el-input v-model="formData.zzdw" style="width: 337px" />
        </el-form-item>
        <el-form-item label="安装日期:" prop="azsj">
            <el-date-picker v-model="formData.azsj" style="width: 337px" type="date" value-format="YYYY-MM-DD"
                :disabled-date="disabledazrq" placeholder="请选择安装日期" />
        </el-form-item>

        <el-form-item label="登记证编号:" prop="certificateNumber">
            <el-input v-model="formData.certificateNumber" style="width: 337px" />
        </el-form-item>
        <el-form-item label="登记机关:" prop="registrationOrgan">
            <el-input v-model="formData.registrationOrgan" style="width: 337px" />
        </el-form-item>
        <el-form-item label="具体位置:" prop="location">
            <el-input v-model="formData.location" style="width: 337px" />
        </el-form-item>
        <el-form-item label="检测机构:">
            <el-input v-model="formData.testingOrganization" style="width: 337px" />
        </el-form-item>
        <el-form-item label="上次检测检验日期:" prop="sycjcrq">
            <el-date-picker v-model="formData.sycjcrq" style="width: 337px" type="date" value-format="YYYY-MM-DD"
                placeholder="请选择上次检测检验日期" :disabled-date="disablednowDate1" />
        </el-form-item>
        <el-form-item label="检测检验周期:" prop="time">
            <el-input v-model="formData.time" style="width: 337px" maxlength="2" @input.native="timeInput">
                <template #append>月</template>
            </el-input>
        </el-form-item>

        <el-form-item label="检查周期:" prop="inspectTime">
            <el-input v-model="formData.inspectTime" type="number" style="width: 337px" placeholder="请输入检查周期">
                <template #append>月</template>
            </el-input>
        </el-form-item>
        <el-form-item label="报废时间:" prop="scrapTime">
            <el-date-picker v-model="formData.scrapTime" type="date" value-format="YYYY-MM-DD" style="width: 337px"
                placeholder="请选择报废时间" />
        </el-form-item>
        <el-form-item label="维保单位:" prop="wborgname">
            <el-select v-model="formData.wborgname" style="width: 337px" @change="changexgf" clearable
                placeholder="请选择维保单位">
                <el-option v-for="item in xgflist" :key="item.id" :label="item.label" :value="item" />
            </el-select>
        </el-form-item>
        <el-form-item label="状态:" prop="state" v-if="formData.id">
            <div style="width: 337px;">
                <MOSTY.DictRidioAndSelect :dictData="D_BZ_SYZT" v-model="formData.state" selectType="radio" />
            </div>
        </el-form-item>
        <el-form-item label="设备资料:" style="width: 100%;" prop="deviceFile">
            <MOSTY.Upload :width="'100%'" :limit="5" :nopicer="true" placeholder="请上传设备资料（pdf,ofd,doc,docx,xls,xlsx）"
                :isImg="false" ShowfileList v-model="formData.deviceFile" :nameshow='true'
                :gsgfList="['pdf', 'ofd', 'doc', 'docx', 'xls', 'xlsx']">
            </MOSTY.Upload>
        </el-form-item>
        <el-form-item label="其它资料:" style="width: 100%;" prop="otherFile">
            <MOSTY.Upload :width="'100%'" :limit="5" :nopicer="true" :isImg="false" ShowfileList
                placeholder="请上传其他资料（pdf,ofd,doc,docx,xls,xlsx）" v-model="formData.otherFile" :nameshow='true'
                :gsgfList="['pdf', 'ofd', 'doc', 'docx', 'xls', 'xlsx']">
            </MOSTY.Upload>
        </el-form-item>
        <el-form-item label="图片上传:" style='width:100%;'>
            <MOSTY.ErwmImg v-if="formData.id"
                :url="qrcodeImg(formData.id, '209', formData.sitename, formData.partname, `${formData.name}(${formData.nbbh})`)"
                :filename='"起重机械二维码"' />
            <div style='display:flex;'>
                <MOSTY.Upload :width="'100%'" :limit="5" :nopicer="false" :isImg="true" :ShowfileList="false"
                    v-model="formData.picture" :nameshow='true' :gsgfList="['jpg', 'png']">
                </MOSTY.Upload>
            </div>
        </el-form-item>
    </el-form>
</template>

<script setup>
import { ref, getCurrentInstance, onMounted, watch } from "vue";
import { ElMessage } from "element-plus";
import { postApi, getApi } from "@/api/tobAcco_api.js";
import * as MOSTY from "@/components/MyComponents/index";
import { qrcodeImg, disablednowDate1 } from "@/utils/tools.js";
import * as rule from "@/utils/rules.js";
const { proxy } = getCurrentInstance();
const { D_BZ_SYZT } = proxy.$dict("D_BZ_SYZT");
const rules = {
    sblx: [{ required: true, message: "请选择起重机械类别", trigger: "blur" }],
    // sycjcrq: [{ required: true, message: "请选择上次检测日期", trigger: "blur" }],
    state: [{ required: true, message: "请选择状态", trigger: "blur" }],
    // wborgname: [{ required: true, message: "请选择维保单位", trigger: "blur" }],
    ...rule.phoneRule({ validator: true, require: true }, "phone"),
    sccj: [{ required: true, message: "请输入生产厂家", trigger: "blur" }],
    // sbxh: [{ required: true, message: "请输入品牌型号", trigger: "blur" }],
    liftingCapacity: [{ required: true, message: "请输入起重量", trigger: "blur" }],
    zzny: [{ required: true, message: "请输入制造日期", trigger: "blur" }],
    zzdw: [{ required: true, message: "请输入制造单位", trigger: "blur" }],
    azsj: [{ required: true, message: "请选择安装日期", trigger: "change" }],

    ccbh: [{ required: true, message: "请输入出厂编号", trigger: "blur" }],
    azsj: [{ required: true, message: "请选择安装日期", trigger: "change" }],
    trsysj: [{ required: true, message: "请选择投入使用日期", trigger: "change" }],
    // sycjcrq: [{ required: true, message: "请选择上一次检查日期", trigger: "change" }],
    // wborgname: [{ required: true, message: "请选择维保单位", trigger: "change" }],
    ...rule.numberzzsRule({ validator: true, require: false, iszs: true, num: 99, minNum: 1 }, "time"),
    ccrq: [{ required: true, message: "请选择出厂日期", trigger: "change" }],
    certificateNumber: [{ required: true, message: "请输入登记证编号", trigger: "blur" }],
    registrationOrgan: [{ required: true, message: "请输入登记机关", trigger: "blur" }],
    location: [{ required: true, message: "请输入具体位置", trigger: "blur" }],
    sitename: [{ required: true, message: "请选择所属场所", trigger: "blur" }],
    buildingname: [{ required: true, message: "请选择所属建筑物", trigger: "blur" }],
    floorname: [{ required: true, message: "请选择所属楼层", trigger: "blur" }],
    partname: [{ required: true, message: "请选择所属部位", trigger: "blur" }],
    ...rule.numberzzsRule({ validator: true, require: false, num: 120 }, "inspectTime"),
    // scrapTime: [{ required: true, message: "请选择报废时间", trigger: "blur" }],
};
const formData = ref({});
const addtype = ref('tzsb')
const formref = ref()
const sbsslist = ref([])
const emits = defineEmits(["update:modelValue", "saveSuccess"]);
// 接收子组件传来的
const props = defineProps({
    getfrom: {
        type: Boolean,
        required: false
    },
    formData: {
        type: Object,
        default: {}
    }, keys: {
        type: Number,
        default: 0
    },
    xgflist: {
        type: Array,
        default: []
    },
    csmclist: {
        type: Array,
        default: () => []
    }
});
function disableddjrq(time) {
    return time.getTime() + 24 * 60 * 60 * 1000 < new Date(formData.value.zzny).getTime() || time.getTime() > Date.now()
}
function disabletrsy(time) {
    return time.getTime() + 24 * 60 * 60 * 1000 < new Date(formData.value.zcdjrq).getTime() || time.getTime() > Date.now()
}
function disablekssg(time) {
    return time.getTime() + 24 * 60 * 60 * 1000 < new Date(formData.value.trsysj).getTime() || time.getTime() > Date.now()
}
function disablejgysrq(time) {
    return time.getTime() + 24 * 60 * 60 * 1000 < new Date(formData.value.kssgrq).getTime() || time.getTime() > Date.now()
}
function change(type) {
    switch (type) {
        case 'zzrq':
            formData.value.zcdjrq = '';
            formData.value.trsysj = '';
            formData.value.kssgrq = '';
            formData.value.jgysrq = '';
            break;
        case 'zcdjrq':
            formData.value.trsysj = '';
            formData.value.kssgrq = '';
            formData.value.jgysrq = '';
            break;
        case 'trsysj':
            formData.value.kssgrq = '';
            formData.value.jgysrq = '';
            break;
        case 'kssgrq':
            formData.value.jgysrq = '';
            break;
        default:
            break;
    }
}
onMounted(() => {
    if (props.formData.id) {
        formData.value = props.formData
    } else {
        formData.value = {}
    }
    getaqbslb()
})
function changexgf(val) {
    formData.value.wborgcode = val.value
    formData.value.wborgname = val.label
    formData.value.phone = val.phone
}
/** 检测周期 - 输入框输入时，去除非数字 */
function timeInput(value) {
    formData.value.time = value ? value.replace(/[\D]/g, '') : ''
}
//获取特种设备字典数据
function getaqbslb() {
    getApi({ zdbh: 'D_TB_JCYWLX', dm: '200506', level: 4 }, '/mosty-base/sysDict/getJcyelxDictTree').then(res => {
        sbsslist.value = res[0].itemList
    })
}
//获取设备设施名称
function getxzqh(val) {
    formData.value.name = val;
}
watch(
    () => props.keys,
    (newValue) => {
        // if (props.getfrom == true) {
        //此处先进行表单校验
        if (!formref.value) return
        formref.value.validate((valid) => {
            if (valid) {
                emits("saveSuccess", formData.value);
            }
        });

        // }

    },
    { deep: true, immediate: true }
);


</script>

<style lang="scss" scoped></style>
