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="consultPhone"
			    labelWidth="80"
			    borderBottom
			>
			    <u--textarea v-model="fromData.consultContent" 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 = {
        '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),
            };
        },
        onLoad() {
        },
        computed: {
        },
        methods: {
            addConsult() {
                this.$refs.uForm.validate().then(async(res) => {
                    let resData = await addConsultMailboxInfo(this.fromData)
                    if(resData.data?.code === 200) {
                        uni.$u.toast(resData.data.msg)
                    }
                }).catch((errors) => {
                    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>