1

lzhe

2024-06-05 dcf9c9e0410fe1186239e3f8d6f7bdc789c08010

 src/views/console/base/Dialog.vue

@@ -1,99 +1,50 @@
<template>
    <el-dialog :title="titleMap[mode]" v-model="visible" :width="800" destroy-on-close @closed="$emit('closed')">
    <el-dialog :title="titleMap[mode]" v-model="visible" :width="1100" destroy-on-close @closed="$emit('closed')">
        <el-form :model="form" :rules="rules" :disabled="mode == 'show'" ref="dialogForm" label-width="120px"
            label-position="center">
            label-position="center" v-if="visible">
            <el-row>
                <el-col :span="24" style="padding:12px 0;">
                    班制详情
                </el-col>
                <el-col :span="12">
                    <el-form-item label="班制编号" prop="userName">
                        <el-input style="width: 240px" v-model="form.userName" placeholder="工位编号" clearable></el-input>
                    <el-form-item label="班制编号" prop="code">
                        <el-input style="width: 240px" v-model="form.code" placeholder="班制编号" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="班制名称" prop="userName">
                        <el-input style="width: 240px" v-model="form.userName" placeholder="工位名称" clearable></el-input>
                    <el-form-item label="班制名称" prop="name">
                        <el-input style="width: 240px" v-model="form.name" placeholder="班制名称" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="班制颜色" prop="userName">
                        <el-input style="width: 240px" v-model="form.userName" placeholder="工位名称" clearable></el-input>
                    <el-form-item label="班制颜色" prop="colour">
                        <el-color-picker size="small" v-model="form.colour" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="班制时间" prop="userName">
                        <el-input style="width: 240px" v-model="form.userName" placeholder="工位名称" clearable></el-input>
                    <el-form-item label="班制时间" prop="range">
                        <ShiftTime v-model="form.range"></ShiftTime>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
            <el-row v-for="item in shiftDetailDTOList" :key="item">
                <el-col :span="24">
                    班次1
                    班次{{ item.shiftIndex }}
                </el-col>
                <el-col :span="24">
                    <el-form-item label="班次名称" prop="userName">
                        <el-input style="width: 240px" v-model="form.userName" placeholder="工位名称" clearable></el-input>
                <el-col :span="12">
                    <el-form-item label="班次名称" prop="indexName">
                        <el-input v-model="item.indexName" placeholder="" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="班次时间" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                <el-col :span="12"></el-col>
                <el-col :span="12">
                    <el-form-item label="班次时间">
                        <Time v-model="item.range"></Time>
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item  label="" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="休息时段1" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="休息时段1" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="休息时段1" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="休息时段1" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                    </el-form-item>
                </el-col>
                <el-col :span="9">
                    <el-form-item label="" prop="userName">
                        <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm"
                            placeholder="Arbitrary time" />
                </el-col><el-col :span="12"></el-col>
                <el-col :span="12" v-for="(v, i) in item.shiftRestTimeDTOList" :key="v.restIndex">
                    <el-form-item :label="'休息时段' + (i + 1)">
                        <Time v-model="v.range"></Time>
                    </el-form-item>
                </el-col>
            </el-row>
@@ -107,27 +58,26 @@

<script>
import deepmerge from 'deepmerge'
import http from "@/utils/request"
import ShiftTime from './shiftTime'
import Time from './Time'
export default {
    emits: ['success', 'closed'],
    components: {
        ShiftTime,
        Time
    },
    props: {
        option: {
            type: Object
        },
        detail: {
            type: Object
        }
    },
    watch: {

    },
    computed: {
        options() {
            let group = deepmerge([], this.option.group)
            group[0].disabled = true
            return {
                ...this.option,
                group,
                calendarList: this.calendarList,
                linkWays: this.linkWays,
                work_type: this.work_type,
                machining_type: this.machining_type
            }
        }
    },
    data() {
        return {
@@ -137,91 +87,138 @@
                edit: '编辑班制',
                // show: '查看'
            },
            params: {},
            visible: false,
            isSaveing: false,
            //表单数据
            form: {
                id: "",
                userName: "",
                avatar: "",
                name: "",
                dept: "",
                group: []
                id: '',
                code: '',
                isUsed: '',
                name: '',
                colour: '',
                startTime: '',
                endTime: '',
                range: [],
                shiftNumber: '',
                number: '',
            },
            options: [
                {
                    label: '上日',
                    value: 0
                },
                {
                    label: '当日',
                    value: 1
                },
                {
                    label: '次日',
                    value: 2
                }
            ],
            shiftDetailDTOList: [],
            //验证规则
            rules: {
                avatar: [
                    { required: true, message: '请上传头像' }
                ],
                userName: [
                    { required: true, message: '请输入登录账号' }
                range: [
                    { required: true, message: '' }
                ],
                name: [
                    { required: true, message: '请输入真实姓名' }
                    { required: true, message: '' }
                ],
                password: [
                    { required: true, message: '请输入登录密码' },
                    {
                        validator: (rule, value, callback) => {
                            if (this.form.password2 !== '') {
                                this.$refs.dialogForm.validateField('password2');
                            }
                            callback();
                        }
                    }
                code: [
                    { required: true, message: '' }
                ],
                password2: [
                    { required: true, message: '请再次输入密码' },
                    {
                        validator: (rule, value, callback) => {
                            if (value !== this.form.password) {
                                callback(new Error('两次输入密码不一致!'));
                            } else {
                                callback();
                            }
                        }
                    }
                ],
                dept: [
                    { required: true, message: '请选择所属部门' }
                ],
                group: [
                    { required: true, message: '请选择所属角色', trigger: 'change' }
                ]
            },
            //所需数据选项
            calendarList: [],
            work_type: [],
            machining_type: [],
            linkWays: [
                {
                    label: '关联机器',
                    value: '0'
                }, {
                    label: '创建同名机器',
                    value: '1'
                }
            ]

        }
    },
    created() {
        this.$API.workstation.calendarList.get().then(res => {
            this.calendarList = res.data
        })
        this.$API.system.dic.getDic.get({ code: 'work_type' }).then(res => {
            this.work_type = res.data
        })
        this.$API.system.dic.getDic.get({ code: 'machining_type' }).then(res => {
            this.machining_type = res.data
        })
    },
    methods: {
        //显示
        open(mode = 'add', params) {
            this.mode = mode;
            this.visible = true;
            this.params = params
            this.$nextTick(() => {
                this.visible = true;
            })

            this.form = {
                id: params?.id,
                code: params?.code,
                isUsed: params?.isUsed,
                name: params?.name,
                colour: params?.colour,
                startTime: params?.startTime,
                endTime: params?.endTime,
                range: [params?.startTime || 0, params?.endTime || 1440],
                shiftNumber: params?.shiftNumber || this?.detail?.paramValue - 0,
                number: params?.number || 1
            }

            if (params?.shiftDetailVOList?.length > 0) {
                this.shiftDetailDTOList = params?.shiftDetailVOList?.map((item, index) => {
                    let shiftRestTimeDTOList = item?.shiftRestTimeVOList.map(item => {
                        return {
                            ...item,
                            range: [item.restStartTime, item.restEndTime]
                        }
                    })
                    while (shiftRestTimeDTOList.length < 4) {
                        shiftRestTimeDTOList.push({
                            range: [0, 0],
                            restStartTime: 0,
                            restEndTime: 0,
                        })
                    }
                    return {
                        range: [item.shiftStartTime || 0, item.shiftEndTime || 1440],
                        shiftStartTime: item.shiftStartTime,
                        shiftEndTime: item.shiftEndTime,
                        shiftIndex: index + 1,
                        indexName: item.indexName,
                        restNumber: index + 1,
                        shiftRestTimeDTOList
                    }

                })
            } else {
                let len = this?.detail?.paramValue - 0 || 1
                let shiftDetailDTOList = []
                for (let i = 0; i < len; i++) {
                    shiftDetailDTOList.push({
                        range: [0, 0],
                        shiftStartTime: 0,
                        shiftEndTime: 0,
                        shiftIndex: i + 1,
                        indexName: '',
                        restNumber: i + 1,
                        shiftRestTimeDTOList: [
                            {
                                range: [0, 0],
                                restStartTime: 0,
                                restEndTime: 0,
                            },
                            {
                                range: [0, 0],
                                restStartTime: 0,
                                restEndTime: 0,
                            },
                            {
                                range: [0, 0],
                                restStartTime: 0,
                                restEndTime: 0,
                            },
                            {
                                range: [0, 0],
                                restStartTime: 0,
                                restEndTime: 0,
                            }
                        ]
                    })
                }
                this.shiftDetailDTOList = shiftDetailDTOList

            }
            return this
        },
        //表单提交方法
@@ -229,7 +226,52 @@
            this.$refs.dialogForm.validate(async (valid) => {
                if (valid) {
                    this.isSaveing = true;
                    var res = await this.$API.demo.post.post(this.form);
                    let data = {
                        shiftNumber: this?.detail?.paramValue - 0,
                        ...this.form, shiftDetailDTOList: this.shiftDetailDTOList.map(item => {
                            return {
                                shiftStartTime: item.range[0],
                                shiftEndTime: item.range[1],
                                shiftIndex: item.shiftIndex,
                                indexName: item.indexName,
                                restNumber: item.restNumber,
                                shiftRestTimeDTOList: item.shiftRestTimeDTOList.filter(v => {
                                    return v.range[1] > v.range[0]
                                }).map((v, i) => {
                                    return {
                                        restStartTime: v.range[0],
                                        restEndTime: v.range[1],
                                        restIndex: i + 1,
                                    }
                                })

                            }
                        })
                    }
                    data.startTime = data.range[0]
                    data.endTime = data.range[1]
                    try {
                        data.startTime = data.range[0]
                        data.endTime = data.range[1]
                        delete data.range
                    } catch (error) {

                    }
                    let res
                    try {
                        if (this.form.id) {
                            res = await this.$HTTP.put('/api/blade-cps/shift', data).catch(() => {
                                throw new Error()
                            })
                        } else {
                            res = await this.$HTTP.post('/api/blade-cps/shift', data).catch(() => {
                                throw new Error()
                            })
                        }
                    } catch (error) {
                        this.isSaveing = false;
                    }

                    this.isSaveing = false;
                    if (res.code == 200) {
                        this.$emit('success', this.form, this.mode)
@@ -245,12 +287,6 @@
        },
        //表单注入数据
        setData(data) {
            this.form.id = data.id
            this.form.userName = data.userName
            this.form.avatar = data.avatar
            this.form.name = data.name
            this.form.group = data.group
            this.form.dept = data.dept

            //可以和上面一样单个注入，也可以像下面一样直接合并进去
            //Object.assign(this.form, data)