add一个数组

<template>
    <view class="padding-bottom-safe-footer-20">
        <view class="bg-ff padding-30 flex justify-between">
            <view>添加日期</view>
            <view>
                <picker mode="date" :value="date"  @change="bindDateChange">
                    <view class="flex align-center">
                        <view class="uni-input text-77">{{date==''?'请选择添加日期':date}}</view>
                        <view class="tyIcon-arrow-right"></view>
                    </view>
                </picker>
            </view>
        </view>
        <view class="margin-20 bg-ff padding-lr-30 radius-10" v-for="(item,index) in list" :key="index">
            <view class="flex justify-end border-bottom-ed padding-tb-30" @click="del(index)">
                <view class="tyIcon-close text-25"></view>
            </view>
            <view class="flex justify-between border-bottom-ed padding-tb-30">
                <view>收支渠道</view>
                <view>
                    <picker @change="bindPickerChange" :data-index='index' :value="item.active" :range="array" >
                        <view class="flex align-center">
                            <view class="uni-input text-77">{{item.active==''?'请选择收支渠道':array[item.active]}}</view>
                            <view class="tyIcon-arrow-right"></view>
                        </view>
                    </picker>
                </view>
            </view>
            <view class="flex justify-between border-bottom-ed padding-tb-30">
                <view>收支名称</view>
                <view>
                    <input class="text-right" v-model="item.name" placeholder="请填写名称"/>
                </view>
            </view>
            <view class="flex justify-between border-bottom-ed padding-tb-30">
                <view>类型</view>
                <view class="flex">
                    <view class="flex align-center" @click="agreeNotice(index,1)">
                        <text
                            :class="[item.category === 1 ? 'tyIcon-round-check text-main' : 'tyIcon-round text-cc','text-32']"
                            ></text>
                        <view class="padding-left-20">收入</view>
                    </view>
                    <view class="flex padding-left-70 align-center" @click="agreeNotice(index,2)">
                        <text
                            :class="[item.category === 2 ? 'tyIcon-round-check text-main' : 'tyIcon-round text-cc','text-32']"
                            ></text>
                        <view class="padding-left-20">支出</view>
                    </view>
                </view>
            </view>
            <view class="flex justify-between  padding-tb-30">
                <view>金额</view>
                <view>
                    <input type="digit" class="text-right" v-model="item.money" placeholder="请填写金额"/>
                </view>
            </view>
        </view>
        <view class="margin-top-20 flex justify-end margin-lr-20" @click="add()">
            <view class="tjmx">+添加明细</view>
        </view>
        <view class="jc-footer-safe margin-lr-30">
            <view class="xzszmx" @click="submitMoneyLogAdd()">提交</view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                list:[
                    {type:'',name:'',category:'',money:'',active:''}
                ],
                agree:true,
                remark:'',
                imagePath:[],
                date:'',
                array: ['银行卡', '支付宝', '微信', '现金'],
                index: 0,
            }
        },
    
        onReady() {
            
        },
    
        onShow() {
            
        },
    
        onReachBottom() {
        },
    
        methods: {
            submitMoneyLogAdd(){
                if(this.list.length==0){
                    this.cn.toast('请添加明细');
                    return
                }
                if(this.date==''){
                    this.cn.toast('请选择添加日期');
                    return
                }
                for(let i in this.list){
                    let item=this.list[i];
                    let index=parseInt(i)+1
                    if(item.type==''){
                        this.cn.toast('请选择第'+index+'项收支渠道');
                        return
                    }
                    if(item.name==''){
                        this.cn.toast('请输入第'+index+'收支名称');
                        return
                    }
                    if(item.category==''){
                        this.cn.toast('请选择第'+index+'项类型');
                        return
                    }
                    if(item.money==''){
                        this.cn.toast('请输入第'+index+'项金额');
                        return
                    }
                }
                // if(this.date==''){
                //     this.cn.toast('请选择收支渠道');
                //     return
                // }
                // if(this.date==''){
                //     this.cn.toast('请输入收支名称');
                //     return
                // }
                // if(this.date==''){
                //     this.cn.toast('请选择收支类型');
                //     return
                // }
                // if(this.date==''){
                //     this.cn.toast('请输入收支金额');
                //     return
                // }
                let arr=[];
                for(let i in this.list){
                    let item=this.list[i]
                    console.log(item);
                    arr.push({
                        type:item.type,
                        name:item.name,
                        category:item.category,
                        money:item.money,
                    })
                }
                this.rq.getData('store/api/Store/submitMoneyLogAdd',{
                    add_time:this.date,
                    log_data:JSON.stringify(arr),
                }).then((res) => {
                    if (res.code == 0) {
                        this.cn.toast(res.msg);
                        uni.navigateBack({
                            delta:1
                        })
                    }
                })
            },
            add(){
                this.list.push({type:'',name:'',category:'',money:''});
            },
            del(index){
                this.list.splice(index,1)
            },
            agreeNotice(index,type) {
                // this.agree=this.agree=!this.agree
                this.list[index].category=type
                
            },
            bindDateChange(e) {
                this.date = e.detail.value
            },
            bindPickerChange(e){
                console.log(e.detail.value);
                // 第几个
                let index = e.currentTarget.dataset.index
                // 数组第几个
                this.list[index].active=e.detail.value;
                
                // array 数组中第几个的id
                // this.array[e.detail.value].id
                this.list[index].type=parseInt(e.detail.value)+1;
                console.log(this.list[index].type);
            },
            imageChange(e) {
                this.imagePath = e.image_list
            },
        }
    }
</script>

<style scoped>
    .padding-left-70{
        padding-left:70rpx;
    }
    .tjmx{
        width: 220rpx;
        height: 70rpx;
        line-height: 70rpx;
        text-align: center;
        border-radius: 10rpx;
        border: 1rpx solid #3476FF;
        color:#3476FF;
    }
    .xzszmx{
        width: 690rpx;
        height: 90rpx;
        line-height: 90rpx;
        color:#ffffff;
        text-align: center;
        background: #3476FF;
        border-radius: 49rpx;
    }
</style>