xiamen-sb-uniapp/pages/receive/receive-add-new.vue

<template>
    <view class="mx3">
        <my-add-button @handleClick="openSpare" />
        <view class="main-color-bg main-bg-future"></view>
        <view class="p3 bg-color-white form-view">
            <u-form :model="form" :error-type="['message']" ref="uForm" >
                <view class="main-color-text f-size-32 f-weight-6">领用信息</view>
                <u-form-item label="仓库名称" prop="storeId" required label-width="150">
                    <my-select
                        :list="storeList"
                        :value-name="'id'"
                        :label-name="'name'"
                        v-model="form.storeId"
                        placeholder="请选择仓库"
                        @selected="storeSelect"
                    />
                </u-form-item>

                <u-form-item label="备品用途" prop="type" label-width="150">
                    <my-select
                        :list="reasonList"
                        v-model="form.reason"
                        @selected="typeSelect"
                        placeholder="请选择备品用途" />
                </u-form-item>

                <u-form-item label="领用说明" label-width="150">
                    <u-input type="textarea" v-model="form.remark" />
                </u-form-item>

            </u-form>
        </view>
        <view class="shop-car">
            <commonCar :list="goodsProducts" @delect="delect" @accounts="accounts">
            </commonCar>
            <image src="" mode=""></image>
        </view>
    </view>
</template>

<script>
import commonCar from '@/components/shopCar/shopCar.vue'
export default {
    components: { commonCar },
    data() {
        return {
            goodsProducts: [{
                name: '华为旗舰店',
                checked: 1,
                goods: []
            }],
            form: {
                storeId: '',
                type: '',
                reason: '',
                storeName: null
            },
            receiveDetailFormList: [

            ],
            backSpareId: '',
            backSpareName: '',
            backFormName: '',
            backPrice: 0,
            isRefreshDetail: true,
            sbSpareList: [],
            storeList: [],
            reasonList: [
                {
                    label: '施工领用',
                    value: '施工领用'
                }, {
                    label: '办公领用',
                    value: '办公领用'
                }, {
                    label: '维修领用',
                    value: '维修领用'
                }, {
                    label: '其他领用',
                    value: '其他领用'
                }
            ],
            rules: {
                reason: [
                    {
                        required: true,
                        message: '请选择备品用途',
                        trigger: ['change']
                    }
                ],
                storeId: [
                    {
                        required: true,
                        message: '请选择仓库',
                        trigger: ['change']
                    }
                ]
            },
            detailFormRules: {
                spareId: [
                    {
                        required: true,
                        message: '请选择备品',
                        trigger: ['change']
                    }
                ],
                num: [
                    {
                        required: true,
                        message: '请填写数量',
                        trigger: ['change', 'blur']
                    }
                ]
            },
            id: '', // 列表 id
            aId: 0
        };
    },
    created () {
    },
    onShow() {
        // 获取设备与仓库
        this.initData();
        const pages = getCurrentPages();
        const currPage = pages[pages.length - 1];
        if(currPage.goods != null && currPage.goods.length > 0){
            currPage.goods.forEach(item => {
                let find = false
                this.goodsProducts[0].goods.forEach(spare => {
                    if (spare.spareId === item.spareId) {
                        find = true
                        return
                    }
                })
                if(!find){
                    this.goodsProducts[0].goods.push(item)
                }
            })
            currPage.goods = null
        }
    },
    onLoad(options) {},

    methods: {
        // 刪除
        delect(e){
            this.goodsProducts[0].goods.forEach((item,index) => {
                if (item.checked === 2) {
                    this.goodsProducts[0].goods.splice(index, 1)
                    return
                }
            })
        },
        // 提交
        accounts(e){
            const params = { ...this.form }
            const detailList = []
            this.goodsProducts[0].goods.forEach(item => {
                const detail = {
                    spareId: item.spareId,
                    num: item.number,
                    price: item.price,
                    spareName: item.spareName,
                    totalPrice: this.$BaseTool.Number.mul(item.number, item.price)
                }
                detailList.push(detail);
            })
            params.detailList = detailList;
            this.$Http.addSparePickForm(params).then(res => {
                uni.redirectTo({
                    url: '/pages/receive/receive-detail?id=' + res.data.id
                });
            })
        },
        del(index) {
            console.log(this.receiveDetailFormList);
            this.receiveDetailFormList.splice(index, 1)
            console.log(this.receiveDetailFormList);
        },
        handleSelect(formName) {
            console.log('formName:' + formName)
            uni.navigateTo({
                url: '/pages/search/spare-search?storeId=' + encodeURIComponent(JSON.stringify(this.form.storeId)) + '&formName=' + encodeURIComponent(JSON.stringify(formName))
            })
        },
        initData() {
            if(this.storeList.length == 0){
                this.$Http.getStorePage({ filter: 2, pageNum: 1, pageSize: 1000 })
                    .then(res => {
                        this.storeList = res.data.rows
                    })
            }
        },
        openSpare() {
            if (this.$BaseTool.String.isBlank(this.form.storeId)) {
                uni.showToast({
                    title: '请先选择仓库',
                    icon: 'none'
                });
                return
            }
            uni.navigateTo({
                url: '/pages/search/spare-search-goods?storeId=' + encodeURIComponent(JSON.stringify(this.form.storeId))
            })
        },
        storeSelect(value, item) {
            this.form.storeName = item.name;
            this.isRefreshDetail = true;
            this.receiveDetailFormList = []
        },
        typeSelect(value, item) {
            this.isRefreshDetail = true;
            //this.receiveDetailFormList = []
        },
        spareSelect(value, item) {
            this.receiveDetailFormList.forEach(spare => {
                if (spare.spareId === item.spareId) {
                    spare.item = item;
                } else {
                    console.log(2222, spare.spareId, item.id)
                }
            })
        },
        // 提交
        submit() {
            if (this.receiveDetailFormList == null || this.receiveDetailFormList.length === 0) {
                uni.showToast({
                    title: '请添加领用明细',
                    icon: 'none'
                });
                return
            }
            const promiseList = []
            promiseList.push(
                new Promise((resolve, reject) => {
                    this.$refs.uForm.validate().then(valid => {
                        if (valid) {
                            resolve(valid);
                        } else {
                            reject(valid);
                        }
                    })
                })
            );
            this.receiveDetailFormList.forEach(item => {
                promiseList.push(
                    new Promise((resolve, reject) => {
                        this.$refs[item.formName][0].validate(valid => {
                            if (valid) {
                                resolve(valid);
                            } else {
                                reject(valid);
                            }
                        })
                    })
                );
            })
            Promise.all(promiseList).then(res => {
                // 执行
                const params = { ...this.form }
                const detailList = []
                this.receiveDetailFormList.forEach(item => {
                    const space = item.item;
                    const detail = {
                        spareId: item.spareId,
                        num: item.num,
                        price: item.price,
                        spareName: item.spareName,
                        storeNum: item.num,
                        totalPrice: this.$BaseTool.Number.mul(item.num, item.price)
                    }
                    detailList.push(detail);
                })
                params.detailList = detailList;
                console.log(33, params)
                this.$Http.addSparePickForm(params).then(res => {
                    uni.redirectTo({
                        url: '/pages/receive/receive'
                    });
                })
            }, err => {
                console.log(err)
            })
        }
    },
    onReady() {
        console.log(4444, this.$refs.uForm)
        this.$refs.uForm.setRules(this.rules);
    }
};
</script>

<style lang="less">
    page {
        background-color: #f4f4f4;
    }
    .mt-3-imt {
        margin-top: 30rpx;
    }
    .shop-car {
        min-height: 100vh;
        display: flex;
        flex-direction: column;
        align-items: center;
        background: #F5F5F5;
    }
</style>