ah-jjzhgd-web/src/views/dataAnalysis/projectSafety/components/addAndEditFormOne.vue

<template>
    <div>
        <el-form
            :model="addAndEditForm"
            label-width="auto"
            ref="addAndEditFormRef"
            :rules="addAndEditFormRules"
        >
            <el-row>
                <el-col :span="12">
                    <el-form-item label="风险编号" prop="riskCode">
                        <el-input
                            clearable
                            maxlength="50"
                            show-word-limit
                            placeholder="请输入风险编号"
                            v-model.trim="addAndEditForm.riskCode"
                        />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="作业部位" prop="riskSite">
                        <el-input
                            clearable
                            maxlength="50"
                            show-word-limit
                            placeholder="请输入作业部位"
                            v-model.trim="addAndEditForm.riskSite"
                        />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="风险等级" prop="riskLevel">
                        <!-- <el-input
                            clearable
                            maxlength="50"
                            show-word-limit
                            placeholder="请输入风险等级"
                            v-model.trim="addAndEditForm.riskLevel"
                        /> -->
                        <el-select
                            v-model="addAndEditForm.riskLevel"
                            placeholder="请选择风险等级"
                            clearable
                            style="width: 100%"
                            filterable
                        >
                            <el-option label="一级风险" value="1" />
                            <el-option label="二级风险" value="2" />
                            <el-option label="三级风险" value="3" />
                            <el-option label="四级风险" value="4" />
                            <el-option label="五级风险" value="5" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="预控措施" prop="controller">
                        <el-input
                            clearable
                            maxlength="50"
                            show-word-limit
                            placeholder="请输入预控措施"
                            v-model.trim="addAndEditForm.controller"
                        />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item
                        label="风险控制关键因素"
                        prop="riskController"
                    >
                        <el-input
                            clearable
                            maxlength="50"
                            show-word-limit
                            placeholder="请输入风险控制关键因素"
                            v-model.trim="addAndEditForm.riskController"
                        />
                    </el-form-item>
                </el-col>

                <el-col :span="12">
                    <el-form-item label="开始日期" prop="startTime">
                        <el-date-picker
                            type="date"
                            style="width: 100%"
                            value-format="yyyy-MM-dd"
                            placeholder="请选择开始日期"
                            v-model="addAndEditForm.startTime"
                        />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="是否销号" prop="isXh">
                        <el-radio-group v-model="addAndEditForm.isXh">
                            <el-radio label="1">是</el-radio>
                            <el-radio label="0">否</el-radio>
                        </el-radio-group>
                    </el-form-item>
                </el-col>
                <el-col :span="12"> </el-col>
            </el-row>
        </el-form>
    </div>
</template>

<script>
import {
    addProjectSafetyAnalysisAPI,
    editProjectSafetyAnalysisAPI,
} from '@/api/dataAnalysis/projectSafety'
export default {
    name: 'AddAndEditFormOne',
    props: {
        detailsId: {
            type: [Number, String],
            default: '',
        },
        editRow: {
            type: Object,
            default: () => {},
        },
    },
    data() {
        return {
            addAndEditForm: {
                riskCode: '',
                riskSite: '',
                riskLevel: '',
                controller: '',
                riskController: '',
                startTime: '',
                isXh: '',
            },
            addAndEditFormRules: {
                riskCode: [
                    {
                        required: true,
                        message: '请输入风险编号',
                        trigger: 'blur',
                    },
                ],
                riskSite: [
                    {
                        required: true,
                        message: '请输入作业部位',
                        trigger: 'blur',
                    },
                ],
                riskLevel: [
                    {
                        required: true,
                        message: '请输入风险等级',
                        trigger: 'blur',
                    },
                ],
                controller: [
                    {
                        required: true,
                        message: '请输入预控措施',
                        trigger: 'blur',
                    },
                ],
                riskController: [
                    {
                        required: true,
                        message: '请输入风险控制关键因素',
                        trigger: 'blur',
                    },
                ],
                startTime: [
                    {
                        required: true,
                        message: '请选择开始日期',
                        trigger: 'blur',
                    },
                ],
                isXh: [
                    {
                        required: true,
                        message: '请选择是否销号',
                        trigger: 'blur',
                    },
                ],
            },
        }
    },

    methods: {
        submitForm() {
            return new Promise((resolve, reject) => {
                this.$refs.addAndEditFormRef.validate(async (valid) => {
                    if (valid) {
                        const params = this.addAndEditForm
                        if (this.detailsId) {
                            params.id = this.detailsId
                        }
                        const API = this.detailsId
                            ? editProjectSafetyAnalysisAPI
                            : addProjectSafetyAnalysisAPI
                        const res = await API(params)
                        if (res.code === 200) {
                            resolve(true)
                        } else {
                            reject(false)
                        }
                    } else {
                        reject(false)
                    }
                })
            })
        },
    },

    watch: {
        editRow: {
            handler(newVal) {
                if (Object.keys(newVal).length > 0) {
                    const {
                        riskCode,
                        riskSite,
                        riskLevel,
                        controller,
                        riskController,
                        startTime,
                        isXh,
                    } = newVal
                    this.addAndEditForm.riskCode = riskCode
                    this.addAndEditForm.riskSite = riskSite
                    this.addAndEditForm.riskLevel = riskLevel
                    this.addAndEditForm.controller = controller
                    this.addAndEditForm.riskController = riskController
                    this.addAndEditForm.startTime = startTime
                    this.addAndEditForm.isXh = isXh
                }
            },
            immediate: true,
        },
    },
}
</script>

<style></style>