<style lang="scss">
@import '@/styles/index.scss'; //导入样式

.companydlg {
    width: 100%;
    margin: auto;

    &__item {
        width: 100%;
        display: flex;

        &-left {
            flex: 1;
        }

        &-right {
            flex: none;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            padding-left: 15px;
            text-align: right;
        }
    }
}
</style>

<template>
    <div class="companydlg">
        <el-form :model="dialogData.editData.data" :rules="dialogData.editData.rules" ref="editDataForm"
            label-width="100px" :size="controlSize">
            <el-form-item label="公司名称" prop="name">
                <el-input v-model.trim="dialogData.editData.data.name" :disabled="isUpdate" auto-complete="off"
                    placeholder="请输入公司名称，注册后公司名称无法修改，必填"></el-input>
            </el-form-item>
            <el-form-item label="公司地址" prop="address">
                <el-input v-model.trim="dialogData.editData.data.address" auto-complete="off"
                    placeholder="请输入公司通信地址，必填"></el-input>
            </el-form-item>
            <el-form-item label="联系人" prop="contact_person">
                <el-input v-model.trim="dialogData.editData.data.contact_person" auto-complete="off"
                    placeholder="请输入联系人姓名，必填"></el-input>
            </el-form-item>
            <el-form-item label="联系电话" prop="contact_tel">
                <el-input v-model.trim="dialogData.editData.data.contact_tel" auto-complete="off"
                    placeholder="请输入联系人电话，必填"></el-input>
            </el-form-item>
            <el-form-item label="登录账户" prop="user_name" v-if="!isUpdate">
                <el-input v-model="dialogData.editData.data.user_name" placeholder="请输入系统管理员登录账户，必填"></el-input>
            </el-form-item>
            <el-form-item label="登录昵称" prop="nickname" v-if="!isUpdate">
                <el-input v-model="dialogData.editData.data.nickname" placeholder="请输入系统管理员登录账户昵称，必填"></el-input>
            </el-form-item>
            <el-form-item label="登录密码" prop="password" v-if="!isUpdate">
                <el-input v-model="dialogData.editData.data.password" placeholder="请输入登录密码,最少4位,最多16位，必填"></el-input>
            </el-form-item>
        </el-form>
        <div style="padding-top: 10px;text-align:right">
            <el-button type="success" @click="hSubmit">确定</el-button>
            <el-button type="warning" @click="hCloseDlg">取消</el-button>
        </div>
    </div>
</template>

<script>
import { companyRegister, getCompanyById, updateCompany } from "@/api/company"

export default {
    name: 'companydlg',
    props: {
        isUpdate: {
            type: Boolean,
            require: true,
            default: false
        },
        id: {
            type: Number,
            require: true,
            default: 1
        }
    },
    data: function () {
        return {
            dialogData: {
                editData: {
                    data: {
                        id: 0,
                        name: '', //公司名称
                        address: '',//公司地址
                        contact_person: '',//联系人
                        contact_tel: '',//联系电话

                        user_name: '', //用户名
                        nickname: '',//用户昵称
                        password: '', //用户密码
                    },
                    rules: {
                        name: [
                            { required: true, message: '请输入公司名称', trigger: 'blur' },
                            { min: 2, max: 32, message: '公司名称字符长度2-32', trigger: 'blur' }
                        ],
                        address: [
                            { required: true, message: '请输入公司地址', trigger: 'blur' },
                            { min: 2, max: 128, message: '公司地址字符长度2-128', trigger: 'blur' }
                        ],
                        contact_person: [
                            { required: true, message: '请输入联系人姓名', trigger: 'blur' },
                            { min: 2, max: 32, message: '联系人姓名字符长度2-32', trigger: 'blur' }
                        ],
                        contact_tel: [
                            { required: true, message: '请输入联系人电话', trigger: 'blur' },
                            { min: 6, max: 128, message: '联系人电话字符长度6-32', trigger: 'blur' }
                        ],
                        user_name: [
                            { required: true, message: '请输入登录账户', trigger: 'blur' },
                            { min: 2, max: 32, message: '登录账户字符长度2-32', trigger: 'blur' }
                        ],
                        nickname: [
                            { required: true, message: '请输入登录账户的昵称', trigger: 'blur' },
                            { min: 2, max: 32, message: '字符长度2-32', trigger: 'blur' }
                        ],
                        password: [
                            { required: true, message: '请输入登录密码', trigger: 'blur' },
                            { min: 4, max: 32, message: '登录密码字符长度4-32', trigger: 'blur' }
                        ]
                    }
                }
            }
        }
    },
    watch: {
    },
    computed: {
        controlSize() {
            return this.$store.getters.controlSize
        }
    },
    mounted() {
        this.$nextTick(function () {
            this.init()
        })
    },
    methods: {
        init() {
            if (this.isUpdate) {
                this.getCompanyById()
            }
        },
        hCloseDlg() {//关闭对话框
            this.$emit("close")//向上一级对话框发射关闭事件
        },
        getData() {
            this.$emit("get")//向上一级对话框发射获得事件
        },
        getCompanyById() {
            let paramData = {}
            paramData.id = parseInt(this.id)
            getCompanyById(paramData).then((res) => {
                this.dialogData.editData.data = res.data
            }).catch((err) => {
                this.$message({ message: err, type: 'error' })
            })
        },
        hSubmit() { //对话框确定按钮响应函数
            this.$refs.editDataForm.validate((valid) => {
                if (valid) {
                    if (!this.isUpdate) {
                        this.companyRegister()
                    } else {
                        this.updateCompany()
                    }
                }
            })
        },
        companyRegister() {//新增
            let paramData = {}
            paramData.name = this.dialogData.editData.data.name
            paramData.address = this.dialogData.editData.data.address
            paramData.contact_person = this.dialogData.editData.data.contact_person
            paramData.contact_tel = this.dialogData.editData.data.contact_tel
            paramData.user_name = this.dialogData.editData.data.user_name
            paramData.nickname = this.dialogData.editData.data.nickname
            paramData.password = this.dialogData.editData.data.password
            companyRegister(paramData).then((res) => {
                this.getData()
                this.dialogData.editData.data.id = res.data
                this.$message.success('公司注册成功', '提示')
            }).catch((err) => {
                this.$message({ message: err, type: 'error' })
            })
        },
        updateCompany() {//修改
            let paramData = {}
            paramData.id = parseInt(this.dialogData.editData.data.id)
            paramData.address = this.dialogData.editData.data.address
            paramData.contact_person = this.dialogData.editData.data.contact_person
            paramData.contact_tel = this.dialogData.editData.data.contact_tel

            updateCompany(paramData).then(() => {
                this.getData()
                this.$message.success('公司资料修改成功', '提示')
            }).catch((err) => {
                this.$message({ message: err, type: 'error' })
            })
        }
    }
}

</script>
