jobslink-user-clent/pageMy/setUserBase/mailbox.vue

<template>
    <view class="app_cotainer">
        <u--form labelPosition="left" :fromData="fromData" :model="fromData" :rules="rules" ref="uForm">
            <u-form-item label="咨询部门:" prop="consultDeptName" labelWidth="80" borderBottom>
                <u--input v-model="fromData.consultDeptName" border="surround" placeholder="请输入咨询部门"></u--input>
            </u-form-item>
            <u-form-item label="咨询题目:" prop="consultTopic" labelWidth="80" borderBottom>
                <u--input v-model="fromData.consultTopic" border="surround" placeholder="请输入咨询题目"></u--input>
            </u-form-item><u-form-item label="咨询内容:" prop="consultContent" labelWidth="80" borderBottom>
                <u--textarea v-model="fromData.consultContent" placeholder="请输入咨询内容"></u--textarea>
            </u-form-item>
            <u-form-item label="咨询人姓名:" prop="consultName" labelWidth="80" borderBottom>
                <u--textarea v-model="fromData.consultName" placeholder="请输入您的姓名"></u--textarea>
            </u-form-item>
            <u-form-item label="咨询人电话:" prop="consultPhone" labelWidth="80" borderBottom>
                <u--input v-model="fromData.consultPhone" border="surround" placeholder="请输入11位电话号码"></u--input>
            </u-form-item>
        </u--form>
        <view class="btn_add">
            <u-button type="primary" size="large" text="发送信件" @click="addConsult"></u-button>
        </view>
    </view>
</template>

<script>
    import {
        dateFormat
    } from '@/untils/format.js'
    import {
        addConsultMailboxInfo
    } from '@/api/content'
    const formData = {
        consultContent: '',
        consultPhone: '',
        consultTopic: '',
        consultDeptName: '',
    }
    const rules = {
        'consultName': {
            type: 'string',
            required: true,
            message: '请填写联系人姓名',
            trigger: ['blur', 'change']
        },
        'consultPhone': {
            type: 'string',
            required: true,
            pattern: /^1[3-9]{1}\d{9}/,
            message: '请填写联系电话',
            trigger: ['blur', 'change']
        },
        'consultContent': {
            type: 'string',
            required: true,
            message: '请填写咨询内容',
            trigger: ['blur', 'change']
        },
        'consultTopic': {
            type: 'string',
            required: true,
            message: '请填写咨询题目',
            trigger: ['blur', 'change']
        },
        'consultDeptName': {
            type: 'string',
            required: true,
            message: '请填写咨询部门',
            trigger: ['blur', 'change']
        },
    }
    export default {
        data() {
            return {
                fromData: Object.assign({}, formData),
                rules: Object.assign({}, rules),
                isNext: true,
            };
        },
        onLoad() {},
        computed: {},
        methods: {
            addConsult() {
                if (this.isNext) {
                    this.isNext = false
                } else {
                    return
                }

                this.$refs.uForm.validate().then(async (res) => {
                    uni.showLoading({
                        title: '请求中'
                    })
                    let resData = await addConsultMailboxInfo(this.fromData)
                    uni.hideLoading()
                    if (resData.data?.code === 200) {
                        uni.$u.toast(resData.data.msg)
                        this.$api.sleep(1000).then(() => {
                            uni.navigateBack(1)
                        })
                    }
                }).catch((errors) => {
                    this.isNext = true
                    this.$api.msg('请输入完整信件信息')
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
    .app_cotainer {
        padding: 24rpx;

        .picker_flag {
            border: 0;
            height: auto;
            display: flex;
            justify-content: flex-start;
            padding: 0;
        }

        .reply_info {}

        .btn_add {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            height: 110rpx;
            background-color: $uni-bg-color-grey;
            padding: 24rpx 24rpx calc(10px + env(safe-area-inset-bottom) / 2) 24rpx;
            text-align: center;
            line-height: 110rpx;
        }
    }
</style>