shenpiguize

Your Name

2022-08-18 d9bb98ca91dc00e852ce2a8477c3e4957afa7183

 src/views/specialWorkSystem/workFlow/approveRule/components/approveItemDialog.vue

@@ -1,5 +1,5 @@
<template>
    <el-dialog v-model="approveItemDialog" :title="title">
    <el-dialog v-model="approveItemDialog" :title="title" :close-on-click-modal="false">
        <el-form :model="approveItemForm" label-width="150px" ref="approveItemFormRef" :rules="approveItemFormRule">
            <el-col :span="24" style="margin-bottom: 24px">
                <el-form-item label="审批项名称" prop="itemName">
@@ -8,21 +8,28 @@
            </el-col>
            <el-col :span="24" style="margin-bottom: 24px">
                <el-form-item label="审批项类型" prop="type">
                    <el-select v-model="approveItemForm.type" placeholder="请选择审批项类型" class="input-add">
                    <el-select v-model="approveItemForm.type" @change="clearValue" placeholder="请选择审批项类型" class="input-add" clearable filterable>
                        <el-option v-for="item in typeList" :key="item.id" :value="item.id" :label="item.name"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>
            <el-col :span="24" style="margin-bottom: 24px">
            <!--            <el-col :span="24" style="margin-bottom: 24px">-->
            <!--                <el-form-item label="措施或标准" prop="smType">-->
            <!--                    <el-select v-model="approveItemForm.smType" @change="clearValue" placeholder="请选择措施或标准" class="input-add" clearable filterable>-->
            <!--                        <el-option v-for="item in smTypeList" :key="item.id" :value="item.id" :label="item.name"></el-option>-->
            <!--                    </el-select>-->
            <!--                </el-form-item>-->
            <!--            </el-col>-->
            <el-col v-if="approveItemForm.type === 2 || approveItemForm.type === 3" :span="24" style="margin-bottom: 24px">
                <el-form-item label="措施名称" prop="measureId">
                    <el-select v-model="approveItemForm.measureId" placeholder="请选择措施" class="input-add">
                    <el-select v-model="approveItemForm.measureId" placeholder="请选择措施" class="input-add" clearable filterable>
                        <el-option v-for="item in actionList" :key="item.id" :value="item.id" :label="item.context"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>
            <el-col :span="24" style="margin-bottom: 20px">
            <el-col v-if="approveItemForm.type === 1" :span="24" style="margin-bottom: 20px">
                <el-form-item label="标准名称" prop="standId">
                    <el-select v-model="approveItemForm.standId" class="input-add" placeholder="选择标准">
                    <el-select v-model="approveItemForm.standId" class="input-add" placeholder="选择标准" clearable filterable>
                        <el-option v-for="item in standardList" :key="item.ruleStandId" :value="item.ruleStandId" :label="item.title"></el-option>
                    </el-select>
                </el-form-item>
@@ -37,7 +44,7 @@
</template>

<script lang="ts">
import { reactive, toRefs, ref, onMounted } from 'vue';
import { reactive, toRefs, ref, onMounted, nextTick } from 'vue';
import { ElMessage } from 'element-plus/es';
import { userApi } from '/@/api/systemManage/user';
import { safetyActionApi } from '/@/api/specialWorkSystem/safetyAction';
@@ -47,18 +54,20 @@
    title: string;
    activeName: string;
    approveItemDialog: boolean;
    approveItemForm: stepAddReqDTO;
    approveItemForm: step;
    approveItemFormRule: {};
    actionList: Array<type>;
    typeList: Array<type>;
    smTypeList: Array<type>;
    standardList: [];
    order: '';
    order: number | null;
}
interface stepAddReqDTO {
interface step {
    itemName: string | null;
    type: null;
    measureId: number | null;
    standId: number | null;
    smType: number | null;
}
interface type {
    id: number;
@@ -76,29 +85,54 @@
                itemName: null,
                type: null,
                measureId: null,
                smType: 1,
                standId: null
            },
            approveItemFormRule: {},
            approveItemFormRule: {
                itemName: [{ required: true, message: '请填写审批项名称', trigger: 'blur' }],
                type: [{ required: true, message: '请选择审批项类型', trigger: 'change' }],
                measureId: [{ required: true, message: '请选择措施', trigger: 'change' }],
                smType: [{ required: true, message: '请选择措施或标准', trigger: 'change' }],
                standId: [{ required: true, message: '请选择标准', trigger: 'change' }]
            },
            actionList: [],
            typeList: [
                { id: 1, name: '数值' },
                { id: 2, name: '选项' },
                { id: 3, name: '填空' }
            typeList: [],
            smTypeList: [
                { id: 1, name: '标准' },
                { id: 2, name: '措施' }
            ],
            standardList: [],
            order: null
        });

        const showApproveItemDialog = (type: string, value: {}, index: number) => {
        const showApproveItemDialog = (type: string, value: {}, index: number, approveLevelForm: { type: number }, standardList: [], actionList: []) => {
            data.approveItemDialog = true;
            data.standardList = standardList;
            data.actionList = actionList;
            data.order = index;
            if (approveLevelForm.type === 3) {
                data.typeList = [
                    { id: 1, name: '数值' },
                    { id: 2, name: '选项' },
                    { id: 3, name: '填空' }
                ];
            } else {
                data.typeList = [
                    { id: 2, name: '选项' },
                    { id: 3, name: '填空' }
                ];
            }
            nextTick(() => {
                approveItemFormRef.value.clearValidate();
            });
            if (type === '新增') {
                data.title = '新增审批项';
                data.approveItemForm = {
                    itemName: null,
                    type: null,
                    measureId: null,
                    standId: null
                    standId: null,
                    smType: 1
                };
            } else {
                data.title = '修改审批项';
@@ -107,43 +141,31 @@
        };

        const submitApproveItem = async () => {
            context.emit('addApprovalItem', data.approveItemForm, data.title, data.order);
            data.approveItemDialog = false;
            approveItemFormRef.value.validate((valid: Boolean) => {
                if (valid) {
                    data.approveItemForm.smType = 1;
                    context.emit('addApprovalItem', data.approveItemForm, data.title, data.order);
                    data.approveItemDialog = false;
                } else {
                    ElMessage({
                        type: 'warning',
                        message: '请完善审批项基本信息'
                    });
                }
            });
        };

        //获取措施项
        const getActionData = async () => {
            let res = await safetyActionApi().getAllSafetyActionList({ workType: null, type: null, context: null });
            if (res.data.code === '200') {
                data.actionList = res.data.data;
        const clearValue = () => {
            if (data.approveItemForm.type === 1) {
                data.approveItemForm.measureId = null;
            } else {
                ElMessage({
                    type: 'warning',
                    message: res.data.msg
                });
                data.approveItemForm.standId = null;
            }
        };

        //获取标准
        const getStandardData = async () => {
            let res = await approveBasicApi().getAllApproveBasicList({ ruleStandType: null, title: null });
            if (res.data.code === '200') {
                data.standardList = res.data.data;
            } else {
                ElMessage({
                    type: 'warning',
                    message: res.data.msg
                });
            }
        };

        // 页面加载时
        onMounted(() => {
            getActionData();
            getStandardData();
        });
        return {
            ...toRefs(data),
            clearValue,
            approveItemFormRef,
            submitApproveItem,
            showApproveItemDialog