<template> 
 | 
    <view class="content"> 
 | 
        <view class="content_search"> 
 | 
            <Search @searchInput="searchInput" @submit="submit" @reset="reset" placeholder="搜索物料名称/编码"></Search> 
 | 
            <view class="content_search_x"></view> 
 | 
            <LabelSelection :TagList="tagList" :isShow="true" @change="clickTag" /> 
 | 
        </view> 
 | 
        <view class="content_total" :style="{top: top}">共{{listData.total}}条数据</view> 
 | 
        <view class="content_list"> 
 | 
            <scroll-view @scrolltolower="getLists" scroll-y :style="{height: height}"> 
 | 
                <view class="fp_list_item" v-for="(item, i) in lists" :key="item.id" @click="clickItem(i)"> 
 | 
                    <view class="fp_list_item_header"> 
 | 
                        <u-checkbox :checked="item.isActive"></u-checkbox> 
 | 
                        <text v-if="item.mmodel">{{item.mmodel.name}}</text> 
 | 
                        <view class="tags" v-if="item.urgent">优先{{item.urgent}}</view> 
 | 
                        <view class="warning" v-if="item.type === 2">返工</view> 
 | 
                        <view class="warning success" v-else-if="item.type === 0">正常</view> 
 | 
                        <view class="warning fail" v-else-if="item.type === 1">异常</view> 
 | 
                    </view> 
 | 
                    <view class="fp_list_item_nr"> 
 | 
                        <view class="item" v-if="item.pmodel"> 
 | 
                            <view class="item_label">工序名称:</view> 
 | 
                            <view class="item_nr">{{item.pmodel.name}}</view> 
 | 
                        </view> 
 | 
                        <view class="item"> 
 | 
                            <view class="item_label">计划日期:</view> 
 | 
                            <view class="item_nr">{{item.planDate}}</view> 
 | 
                        </view> 
 | 
                        <view class="item"> 
 | 
                            <view class="item_label">计划数量:</view> 
 | 
                            <view class="item_nr">{{item.num}}</view> 
 | 
                        </view> 
 | 
                        <view class="item"> 
 | 
                            <view class="item_label">生产批次:</view> 
 | 
                            <view class="item_nr">{{item.batch}}</view> 
 | 
                        </view> 
 | 
                        <view class="item"> 
 | 
                            <view class="item_label">库存:</view> 
 | 
                            <view class="item_nr">{{item.isStock === 0 ? '不满足' : '满足'}}</view> 
 | 
                        </view> 
 | 
                    </view> 
 | 
                </view> 
 | 
            </scroll-view> 
 | 
        </view> 
 | 
        <view class="fp_zw"></view> 
 | 
        <view class="fp_footer"> 
 | 
            <view class="fp_footer_button" @click="submit">分配(1)</view> 
 | 
        </view> 
 | 
    </view> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
    import Search from '@/components/Search.vue' 
 | 
    import LabelSelection from '@/components/LabelSelection.vue' 
 | 
    export default { 
 | 
        components: { Search, LabelSelection }, 
 | 
        data() { 
 | 
            return { 
 | 
                height: '', 
 | 
                top: '', 
 | 
                listData: { 
 | 
                    capacity: 10, 
 | 
                    page: 0, 
 | 
                    total: 0, 
 | 
                    startDate: '', 
 | 
                    endDate: '', 
 | 
                    procedureIds: [], 
 | 
                    departIds: '', 
 | 
                    mixParam: '', 
 | 
                    cateIds: [] 
 | 
                }, 
 | 
                tagList: [ 
 | 
                    { 
 | 
                        id: '', 
 | 
                        name: '注射', 
 | 
                        num: '0' 
 | 
                    }, 
 | 
                    { 
 | 
                        id: '0', 
 | 
                        name: '烧结', 
 | 
                        num: '0' 
 | 
                    }, 
 | 
                    { 
 | 
                        id: '1,4', 
 | 
                        name: '焊接', 
 | 
                        num: '0' 
 | 
                    } 
 | 
                ], 
 | 
                data: [],    // 工序数据 
 | 
                factoryList: [], 
 | 
                finished: true, 
 | 
                loading: false, 
 | 
                refreshing: false, 
 | 
                timeShow: false, 
 | 
                lists: [ 
 | 
                    { 
 | 
                        id: 1, 
 | 
                        status: 0, 
 | 
                        urgent: 1, 
 | 
                        num: 100, 
 | 
                        isActive: false, 
 | 
                        batch: '11111', 
 | 
                        planDate: '2023-08-29', 
 | 
                        mmodel: { 
 | 
                            name: '工序计划', 
 | 
                            code: 'fbdseasafghb' 
 | 
                        }, 
 | 
                        usermodel: { 
 | 
                            realname: '计划人员' 
 | 
                        }, 
 | 
                        pmodel: { 
 | 
                            name: '工序计划' 
 | 
                        }, 
 | 
                        fmodel: { 
 | 
                            name: '工厂' 
 | 
                        } 
 | 
                    }, 
 | 
                    { 
 | 
                        id: 2, 
 | 
                        status: 0, 
 | 
                        urgent: 1, 
 | 
                        num: 100, 
 | 
                        isActive: false, 
 | 
                        batch: '11111', 
 | 
                        planDate: '2023-08-29', 
 | 
                        mmodel: { 
 | 
                            name: '工序计划', 
 | 
                            code: 'fbdseasafghb' 
 | 
                        }, 
 | 
                        usermodel: { 
 | 
                            realname: '计划人员' 
 | 
                        }, 
 | 
                        pmodel: { 
 | 
                            name: '工序计划' 
 | 
                        }, 
 | 
                        fmodel: { 
 | 
                            name: '工厂' 
 | 
                        } 
 | 
                    }, 
 | 
                    { 
 | 
                        id: 3, 
 | 
                        status: 0, 
 | 
                        urgent: 1, 
 | 
                        num: 100, 
 | 
                        batch: '11111', 
 | 
                        isActive: false, 
 | 
                        planDate: '2023-08-29', 
 | 
                        mmodel: { 
 | 
                            name: '工序计划', 
 | 
                            code: 'fbdseasafghb' 
 | 
                        }, 
 | 
                        usermodel: { 
 | 
                            realname: '计划人员' 
 | 
                        }, 
 | 
                        pmodel: { 
 | 
                            name: '工序计划' 
 | 
                        }, 
 | 
                        fmodel: { 
 | 
                            name: '工厂' 
 | 
                        } 
 | 
                    }, 
 | 
                    { 
 | 
                        id: 4, 
 | 
                        status: 0, 
 | 
                        urgent: 1, 
 | 
                        num: 100, 
 | 
                        isActive: false, 
 | 
                        batch: '11111', 
 | 
                        planDate: '2023-08-29', 
 | 
                        mmodel: { 
 | 
                            name: '工序计划', 
 | 
                            code: 'fbdseasafghb' 
 | 
                        }, 
 | 
                        usermodel: { 
 | 
                            realname: '计划人员' 
 | 
                        }, 
 | 
                        pmodel: { 
 | 
                            name: '工序计划' 
 | 
                        }, 
 | 
                        fmodel: { 
 | 
                            name: '工厂' 
 | 
                        } 
 | 
                    }, 
 | 
                    { 
 | 
                        id: 5, 
 | 
                        status: 0, 
 | 
                        urgent: 1, 
 | 
                        num: 100, 
 | 
                        isActive: false, 
 | 
                        batch: '11111', 
 | 
                        planDate: '2023-08-29', 
 | 
                        mmodel: { 
 | 
                            name: '工序计划', 
 | 
                            code: 'fbdseasafghb' 
 | 
                        }, 
 | 
                        usermodel: { 
 | 
                            realname: '计划人员' 
 | 
                        }, 
 | 
                        pmodel: { 
 | 
                            name: '工序计划' 
 | 
                        }, 
 | 
                        fmodel: { 
 | 
                            name: '工厂' 
 | 
                        } 
 | 
                    } 
 | 
                ] 
 | 
            }; 
 | 
        }, 
 | 
        onReady() { 
 | 
            var that = this 
 | 
            this.$nextTick(() => { 
 | 
                uni.createSelectorQuery().in(this).select('.content_search').boundingClientRect((rect) => { 
 | 
                    that.height = `calc(100vh - ${rect.height + 80}px)` 
 | 
                    that.top = `${rect.height}px` 
 | 
                }).exec() 
 | 
            }) 
 | 
        }, 
 | 
        methods: { 
 | 
            // 点击当前项 
 | 
            clickItem(i) { 
 | 
                this.lists.forEach((item, index) => { 
 | 
                    item.isActive = i === index; 
 | 
                }) 
 | 
            }, 
 | 
            // 跳转 
 | 
            jump(item) { 
 | 
                uni.navigateTo({ 
 | 
                    url: `/pages/planDetails/planDetails?id=${item.id}` 
 | 
                }) 
 | 
            }, 
 | 
            // 获取头部组件高度 
 | 
            getHeight(height) { 
 | 
                this.height = height 
 | 
            }, 
 | 
            // 重置 
 | 
            reset() { 
 | 
                this.listData.page = 0 
 | 
                this.finished = false 
 | 
                this.lists = [] 
 | 
                this.listData.mixParam = '' 
 | 
                this.listData.startDate = '' 
 | 
                this.listData.endDate = '' 
 | 
                this.listData.procedureIds = [] 
 | 
                if (this.factoryList.length > 0) { 
 | 
                    this.listData.departIds = this.factoryList[0].id 
 | 
                } 
 | 
                if (this.data.length > 0) { 
 | 
                    this.data.forEach(item => { item.isActive = false }) 
 | 
                } 
 | 
                // this.getLists() 
 | 
                // this.pageCounts() 
 | 
            }, 
 | 
            // 日期确定 
 | 
            timeConfirm(val) { 
 | 
                this.listData.startDate = val[0] 
 | 
                this.listData.endDate = val[val.length - 1] 
 | 
                this.timeShow = false 
 | 
            }, 
 | 
            // 切换工厂 
 | 
            changeTags(i, id) { 
 | 
                this.listData.departIds = id 
 | 
                this.getWorkingProcedures(id) 
 | 
                this.factoryList.forEach((item, index) => { 
 | 
                    if (index === i) { 
 | 
                        item.isActive = true 
 | 
                    } else { 
 | 
                        item.isActive = false 
 | 
                    } 
 | 
                }) 
 | 
            }, 
 | 
            // 打开日期插件 
 | 
            openDate() { 
 | 
                this.timeShow = true 
 | 
            }, 
 | 
            // 搜索 
 | 
            searchInput(val) { 
 | 
                this.listData.mixParam = val 
 | 
                this.listData.page = 0 
 | 
                this.finished = false 
 | 
                this.lists = [] 
 | 
                this.getLists() 
 | 
            }, 
 | 
            // 点击标签搜索 
 | 
            clickTag(ids) { 
 | 
                this.listData.cateIds = ids 
 | 
                this.listData.page = 0 
 | 
                this.finished = false 
 | 
                this.lists = [] 
 | 
                // this.getLists() 
 | 
            }, 
 | 
            // 获取列表统计 
 | 
            pageCounts() { 
 | 
                pageCount({ 
 | 
                    factoryId: this.listData.departIds, 
 | 
                    procedureIdList: this.listData.procedureIds ? this.listData.procedureIds : [], 
 | 
                    startDate: this.listData.startDate, 
 | 
                    endDate: this.listData.endDate, 
 | 
                    statusList: this.listData.cateIds 
 | 
                }).then(res => { 
 | 
                    if (res.code === 200 && res.data) { 
 | 
                        this.tagList[0].num = res.data.allNum.toString() 
 | 
                        this.tagList[1].num = res.data.startNum.toString() 
 | 
                        this.tagList[2].num = res.data.ingNum.toString() 
 | 
                        this.tagList[3].num = res.data.endNum.toString() 
 | 
                    } 
 | 
                }) 
 | 
            }, 
 | 
            // 获取工厂数据 
 | 
            getOrganizations() { 
 | 
                getOrganization({ 
 | 
                    type: 1 
 | 
                }).then(res => { 
 | 
                    if (res.code === 200 && res.data && res.data.length !== 0) { 
 | 
                        res.data.forEach((item, i) => { 
 | 
                            item.isActive = i === 0; 
 | 
                        }) 
 | 
                        if (res.data.length > 0) { 
 | 
                            this.factoryList = res.data 
 | 
                            this.listData.departIds = this.factoryList[0].id 
 | 
                            this.listData.procedureIds = '' 
 | 
                            this.finished = false 
 | 
                            this.getWorkingProcedures(this.factoryList[0].id) 
 | 
                            this.getLists() 
 | 
                            this.pageCounts() 
 | 
                        } 
 | 
                    } 
 | 
                }) 
 | 
            }, 
 | 
            // 获取工序数据 
 | 
            getWorkingProcedures(orgId) { 
 | 
                this.data = [] 
 | 
                getWorkingProcedure({ orgId }) 
 | 
                    .then(res => { 
 | 
                        if (res.code === 200 && res.data && res.data.length !== 0) { 
 | 
                            res.data.forEach((item, i) => { 
 | 
                                item.isActive = false; 
 | 
                            }) 
 | 
                            this.data = res.data 
 | 
                        } 
 | 
                    }) 
 | 
            }, 
 | 
            submit() { 
 | 
                let data; 
 | 
                this.lists.forEach(item => { 
 | 
                    if (item.isActive) { 
 | 
                        data = item 
 | 
                    } 
 | 
                }) 
 | 
                if (!data) { 
 | 
                    uni.showToast({ title: '至少选择一项计划!', duration: 2000 }); 
 | 
                    return 
 | 
                } 
 | 
                uni.navigateTo({ 
 | 
                    url: `/pages/allocation/allocation?gxid=${data.procedureId}&jhid=${data.id}&num=${data.workorderDistributNum ? data.num - data.workorderDistributNum : data.num}` 
 | 
                }) 
 | 
            }, 
 | 
            // 获取计划列表数据 
 | 
            getLists() { 
 | 
                console.log('getLists') 
 | 
                if (!this.finished) { 
 | 
                    this.loading = true 
 | 
                    this.listData.page = this.listData.page++ 
 | 
                    getList({ 
 | 
                        capacity: this.listData.capacity, 
 | 
                        model: { 
 | 
                            mixParam: this.listData.mixParam, 
 | 
                            startDate: this.listData.startDate, 
 | 
                            endDate: this.listData.endDate, 
 | 
                            procedureIdList: this.listData.procedureIds ? this.listData.procedureIds : [], 
 | 
                            factoryId: this.listData.departIds, 
 | 
                            statusList: this.listData.cateIds 
 | 
                        }, 
 | 
                        page: this.listData.page, 
 | 
                        sorts: [ 
 | 
                            { 
 | 
                                direction: 'ASC', 
 | 
                                property: 'publishDate' 
 | 
                            } 
 | 
                        ] 
 | 
                    }).then(res => { 
 | 
                        this.loading = false 
 | 
                        this.listData.total = res.data.total 
 | 
                        if (this.refreshing) { 
 | 
                            this.lists = [] 
 | 
                            this.refreshing = false; 
 | 
                        } 
 | 
                        if (res.code === 200 && res.data.records.length !== 0) { 
 | 
                            if (this.lists.length === 0) { 
 | 
                                this.lists = res.data.records 
 | 
                            } else { 
 | 
                                this.lists.push(...res.data.records) 
 | 
                            } 
 | 
                        } else { 
 | 
                            this.finished = true 
 | 
                        } 
 | 
                    }).catch(err => { 
 | 
                        this.loading = false 
 | 
                        this.finished = true 
 | 
                        if (this.refreshing) { 
 | 
                            this.lists = [] 
 | 
                            this.refreshing = false; 
 | 
                        } 
 | 
                    }) 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
    .content { 
 | 
        .content_search { 
 | 
            width: 100%; 
 | 
            padding: 30rpx; 
 | 
            background: white; 
 | 
            position: sticky; 
 | 
            top: 0; 
 | 
            z-index: 999; 
 | 
            box-sizing: border-box; 
 | 
            .Search_item { 
 | 
                margin-bottom: 40rpx; 
 | 
                .Search_item_label { 
 | 
                    font-size: 30rpx; 
 | 
                    font-weight: 500; 
 | 
                    color: #222222; 
 | 
                } 
 | 
                .Search_item_content { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    justify-content: space-between; 
 | 
                    margin-top: 30rpx; 
 | 
                    .tag { 
 | 
                        display: flex; 
 | 
                        flex-wrap: wrap; 
 | 
                        align-items: center; 
 | 
                        .tag_active { 
 | 
                            background: $nav-color !important; 
 | 
                            color: #ffffff !important; 
 | 
                        } 
 | 
                        .tag_item { 
 | 
                            padding: 22rpx 26rpx; 
 | 
                            box-sizing: border-box; 
 | 
                            background: #F2F2F2; 
 | 
                            border-radius: 8rpx; 
 | 
                            font-size: 26rpx; 
 | 
                            font-weight: 400; 
 | 
                            color: #333333; 
 | 
                            display: flex; 
 | 
                            align-items: center; 
 | 
                            justify-content: center; 
 | 
                            margin-right: 22rpx; 
 | 
                            margin-bottom: 22rpx; 
 | 
                        } 
 | 
                    } 
 | 
                    text { 
 | 
                        font-size: 26rpx; 
 | 
                        font-weight: 400; 
 | 
                        color: #333333; 
 | 
                        margin: 0 30rpx; 
 | 
                    } 
 | 
                    .Search_item_content_a { 
 | 
                        padding: 20rpx 0; 
 | 
                        flex: 1; 
 | 
                        background: #F7F7F7; 
 | 
                        border-radius: 8rpx; 
 | 
                        border: 1rpx solid #EEEEEE; 
 | 
                        font-size: 26rpx; 
 | 
                        font-weight: 400; 
 | 
                        color: #B2B2B2; 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        justify-content: center; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .content_search_x { 
 | 
                height: 24rpx; 
 | 
            } 
 | 
        } 
 | 
        .content_list { 
 | 
            width: 100%; 
 | 
            display: flex; 
 | 
            flex-direction: column; 
 | 
            .fp_list_item { 
 | 
                background: white; 
 | 
                display: flex; 
 | 
                flex-direction: column; 
 | 
                padding: 30rpx; 
 | 
                border-bottom: 1rpx solid #ececec; 
 | 
                .fp_list_item_header { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    text { 
 | 
                        max-width: 64%; 
 | 
                        overflow: hidden; 
 | 
                        white-space: nowrap; 
 | 
                        text-overflow: ellipsis; 
 | 
                        -o-text-overflow: ellipsis; 
 | 
                        font-size: 32rpx; 
 | 
                        font-weight: 500; 
 | 
                        color: #333333; 
 | 
                        margin-left: 14rpx; 
 | 
                    } 
 | 
                    .tags { 
 | 
                        flex-shrink: 0; 
 | 
                        margin-left: 16rpx; 
 | 
                        padding: 5rpx 10rpx; 
 | 
                        background: $nav-stateColor4; 
 | 
                        border-radius: 8rpx; 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        justify-content: center; 
 | 
                        font-size: 22rpx; 
 | 
                        font-weight: 400; 
 | 
                        color: #FFFFFF; 
 | 
                    } 
 | 
                    .fail { 
 | 
                        background: $nav-stateColor4 !important; 
 | 
                    } 
 | 
                    .success { 
 | 
                        background: $nav-stateColor2 !important; 
 | 
                    } 
 | 
                    .warning { 
 | 
                        flex-shrink: 0; 
 | 
                        margin-left: 16rpx; 
 | 
                        padding: 5rpx 10rpx; 
 | 
                        background: $nav-stateColor5; 
 | 
                        border-radius: 8rpx; 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        justify-content: center; 
 | 
                        font-size: 22rpx; 
 | 
                        font-weight: 400; 
 | 
                        color: #FFFFFF; 
 | 
                    } 
 | 
                } 
 | 
                .fp_list_item_nr { 
 | 
                    padding: 24rpx 30rpx; 
 | 
                    background: #F7F7F7; 
 | 
                    border-radius: 16rpx; 
 | 
                    margin-top: 32rpx; 
 | 
                    display: flex; 
 | 
                    align-items: flex-start; 
 | 
                    flex-wrap: wrap; 
 | 
                    .item { 
 | 
                        display: flex; 
 | 
                        align-items: flex-start; 
 | 
                        width: 50%; 
 | 
                        margin-top: 24rpx; 
 | 
                        &:nth-child(1) { 
 | 
                            margin-top: 0!important; 
 | 
                        } 
 | 
                        &:nth-child(2) { 
 | 
                            margin-top: 0!important; 
 | 
                        } 
 | 
                        .item_label { 
 | 
                            width: 130rpx; 
 | 
                            flex-shrink: 0; 
 | 
                            font-size: 24rpx; 
 | 
                            font-weight: 400; 
 | 
                            color: #666666; 
 | 
                            text-align: right; 
 | 
                        } 
 | 
                        .item_nr { 
 | 
                            font-size: 24rpx; 
 | 
                            font-weight: 400; 
 | 
                            color: #222222; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        .content_total { 
 | 
            width: 100%; 
 | 
            height: 80rpx; 
 | 
            padding: 24rpx 30rpx; 
 | 
            background: #F7F7F7; 
 | 
            font-size: 24rpx; 
 | 
            font-weight: 400; 
 | 
            box-sizing: border-box; 
 | 
            color: #666666; 
 | 
            position: sticky; 
 | 
            z-index: 99; 
 | 
        } 
 | 
        .fp_zw { 
 | 
            height: 150px; 
 | 
        } 
 | 
        .fp_footer { 
 | 
            width: 100%; 
 | 
            padding-bottom: env(safe-area-inset-bottom); 
 | 
            position: fixed; 
 | 
            bottom: 0; 
 | 
            left: 0; 
 | 
            background: #ffffff; 
 | 
            .fp_footer_button { 
 | 
                width: 272rpx; 
 | 
                height: 98rpx; 
 | 
                background: $nav-color; 
 | 
                font-size: 32rpx; 
 | 
                font-weight: 500; 
 | 
                color: #FFFFFF; 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: center; 
 | 
                float: right; 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</style> 
 |