xiamen-sb-uniapp/pages/use-repair/use-repair.vue

<template>
    <view class="mx3">
        <view class="main-color-bg" style="height: 100rpx; margin: 0 -30rpx"></view>
        <view class="p3 bg-color-white" style="margin-top: -50rpx; border-radius: 20rpx">
            <u-form :model="form" ref="uForm" :label-width="150">
                <u-form-item label="选择仓库">
                    <u-input v-model="form.store" disabled @click="storeState = true" type="select" />
                    <u-select
                        v-model="storeState"
                        :list="storeList"
                        @confirm="storeSubmit"
                    ></u-select>
                </u-form-item>
                <u-form-item label="备件类型">
                    <u-input v-model="form.type" disabled @click="typeState = true" type="select" />
                    <u-select v-model="typeState" :list="typeList" @confirm="typeSubmit"></u-select>
                </u-form-item>
                <u-form-item label="备件用途">
                    <u-input v-model="form.purpose" disabled @click="purposeState = true" type="select" />
                    <u-select
                        v-model="purposeState"
                        :list="purposeList"
                        @confirm="purposeSubmit"
                    ></u-select>
                </u-form-item>
                <u-form-item label="备件">
                    <u-input v-model="form.repair" disabled @click="repairState = true" type="select" />
                    <u-select
                        v-model="repairState"
                        :list="repairList"
                        @confirm="repairSubmit"
                    ></u-select>
                </u-form-item>
                <u-form-item label="数量">
                    <u-input v-model="form.number" />
                </u-form-item>
            </u-form>
            <button class="main-color-bg text-color-white" @tap="handleSubmit">提交</button>
        </view></view
    >
</template>

<script>
export default {
    data() {
        return {
            form: {
                store: '',
                type: '',
                purpose: '',
                repair: '',
                number: ''
            },
            storeState: false,
            storeList: [
                {
                    label: '仓库1'
                },
                {
                    label: '仓库2'
                }
            ],
            typeState: false,
            typeList: [
                {
                    label: '类型1'
                },
                {
                    label: '类型2'
                }
            ],
            purposeState: false,
            purposeList: [
                {
                    label: '用途1'
                },
                {
                    label: '用途2'
                }
            ],
            repairState: false,
            repairList: [
                {
                    label: '备件1'
                },
                {
                    label: '备件2'
                }
            ]
        };
    },
    methods: {
        handleSubmit() {},
        repairSubmit(data) {
            this.form.repair = data[0].label;
        },
        purposeSubmit(data) {
            this.form.purpose = data[0].label;
        },
        typeSubmit(data) {
            this.form.type = data[0].label;
        },
        storeSubmit(data) {
            this.form.store = data[0].label;
        }
    }
};
</script>

<style></style>