<template>
    <div class="bottom_box">

        <div>
            <el-button :type="item.type" v-for="(item, i) in btnList[1]" :key="i" @click="handlerToPage(item)">{{
                item.name }}</el-button>
        </div>

        <div>
            <el-button type="primary" @click="handPause()">{{ GDStatus == 9 ? '取消暂停' : '暂停' }}</el-button>
            <el-button type="primary" @click="handTerminate()">终止</el-button>
            <el-button type="primary">转派</el-button>
            <el-button type="primary">委外</el-button>
            <el-button type="primary" @click="handHandover()">交接</el-button>

        </div>


        <!-- 交接 -->
        <handover ref="handoverRef"></handover>

        <!-- 领料 -->
        <picking-dom ref="pickingDomRef"></picking-dom>

    </div>
</template>

<script>
import { updateStatusPauseRecover, updateStatusPause, updateStatusTerminate } from '@/api/workOrderList'
import handover from './handover'
import pickingDom from './produce/pickingDom'
export default {
    props:{
        workOrderInfo:{
            type: Object,
            default:() => ({})
        }
    },
    data() {
        return {
            isOperate: false,
            sceneText: '',
            outsourceScene: null,
            btnsList: [],
            btnState: 1,
            GDStatus: null,
            btnControlReportMethod: null,
            btnList: {
                1: [{
                    name: '领料',
                    id: '1',
                    type: 'success'
                },
                {
                    name: '投料',
                    id: '2',
                    type: 'success'
                },

                {
                    name: '更换周转车',
                    id: '3',
                    type: 'success'
                },
                {
                    name: '报工',
                    type: 'success',
                    id: '4',
                    isOutsource: 0
                },
                    // {
                    // 	name: '多工单报工',
                    // 	type: ''
                    // }



                ],
                2: [{
                    name: '取样',
                    type: 'sample'
                },
                {
                    name: '报工',
                    id: '4',
                    type: 'sampleJob'
                },
                ],

                3: [{
                    name: '更换周转车',
                    type: 'qualityTurnover'
                },

                {
                    name: '质检',
                    type: 'inspection'
                },

                {
                    name: '报工',
                    id: '4',
                    type: 'inspectionJob'
                }



                ],

                4: [{
                    name: '领料',
                    id: '1',
                    type: 'picking'
                },
                {
                    name: '投料',
                    id: '2',
                    type: 'feeding'
                },
                {
                    name: '报工',
                    id: '4',
                    type: 'jobBooking'
                },


                ],

                5: [{
                    name: '入库',
                    type: 'warehousing'
                },

                ],

                6: [{
                    name: '报工',
                    id: '4',
                    type: 'jobBooking'
                },



                ],


            },
            btnListOne: {
                1: [{
                    name: '领料',
                    type: 'picking'
                },
                {
                    name: '投料',
                    type: 'feeding'
                },

                {
                    name: '报工',
                    type: 'jobBooking',
                    isOutsource: 0
                },
                    // {
                    // 	name: '多工单报工',
                    // 	type: ''
                    // }



                ],
                2: [{
                    name: '取样',
                    type: 'sample'
                },
                {
                    name: '报工',
                    type: 'sampleJob'
                },
                ],

                3: [


                    {
                        name: '质检',
                        type: 'inspection'
                    },

                    {
                        name: '报工',
                        type: 'inspectionJob'
                    }



                ],

                4: [{
                    name: '领料',
                    type: 'picking'
                },
                {
                    name: '投料',
                    type: 'feeding'
                },
                {
                    name: '报工',
                    type: 'jobBooking'
                },


                ],

                5: [{
                    name: '入库',
                    type: 'warehousing'
                },

                ],

                6: [{
                    name: '报工',
                    type: 'jobBooking'
                },



                ],


            },
            sceneText: '',
            outsourceScene: null,
            newTaskObj: {},
            outsourceShow: false,

            outsourceForm: {

            },

            produceList: [],
            warehouseList: [],

            typeList: [{
                id: 4,
                name: '带料生产委外'
            },
            {
                id: 5,
                name: '不带料生产委外'
            },

            ],

            newStepsList: [],



            // clientEnvironmentId: uni.getStorageSync("userInfo") && uni.getStorageSync("userInfo").clientEnvironmentId, // *1 主环境-601环境   2 soll-索尔环境    3 tg-碳谷环境

            isInWarehouse: []



        }
    },

    components: { handover, pickingDom },

    created() {

    },

    methods: {

        //操作按钮处理器
        handlerToPage(item) {
            console.log(item, 'handlerToPage');
            const actions = {
                '1': () => this.openPickingDomRef(),
                '2': () => { }
            };

            const action = actions[item.id];

            if (action) {
                action()
            }




        },


        // 委外弹窗
        openPickingDomRef() {
      
            let ids = [this.workOrderInfo.id];

            let taskId = this.workOrderInfo?.taskId||''
            let newTaskObj = {
                ids, taskId
            }

            this.$refs.pickingDomRef.open(newTaskObj)
        },








        // 委外时间选择

        //委外到 类型选择
        changeTaskId(e) {
            console.log(this.outsourceForm, e);
            if (this.newStepsList.length) {
                const id = this.newStepsList[0].sourceTaskId;
                //isFirstTask 1是首工序 0不是
                if (this.outsourceForm.isFirstTask) {
                    this.sceneText = "首工序";
                    this.outsourceForm.outsourceScene = 1;
                    if (e.sourceTaskId !== id) {
                        this.sceneText = "首工序及多工序";
                        this.outsourceForm.outsourceScene = 4;
                    }
                } else {
                    if (e.sourceTaskId === id) {
                        // 单工序
                        this.sceneText = "单工序"
                        this.outsourceForm.outsourceScene = 2;
                    } else {
                        //多工序
                        this.sceneText = "多工序"
                        this.outsourceForm.outsourceScene = 3;
                    }
                }

            } else {
                // uni.showToast({
                //     title: '委外到工序为空',
                //     icon: 'none'
                // })
            }
        },

        open() {
            this.isOperate = !this.isOperate
        },

        operate(type, item) {

            this.$emit('operate', type, item)
        },


        handOutsource() {


            let param = {
                taskId: this.newTaskObj.currentTaskId,
                workOrderId: this.newTaskObj.workOrderId,

            }
            checkOutsource(param).then(res => {

                this.outsourceForm = {
                    ...res,


                }
                this.outsourceForm.name = this.taskObj.currentTaskName + '委外'



                if (res.outsource) {
                    this.getNewSteps()
                    this.outsourceShow = true
                    this.produceFn()
                    this.getWarehouseFn()
                } else {
                    // uni.showToast({
                    //     title: '此工序不能委外',
                    //     icon: 'none'
                    // })
                }
            })

        },


        handPause() {
            if (this.GDStatus == 9) {
                this.$confirm('确定该工单取消暂停?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    updateStatusPauseRecover([this.newTaskObj.workOrderId]).then(res => {
                        // this.$emit('refresh')
                    })
                }).catch(() => {

                })
            } else {

                this.$confirm('确定该工单暂停?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    updateStatusPause([this.newTaskObj.workOrderId]).then(res => {
                        // this.$emit('refresh')
                    })
                }).catch(() => {

                })

            }

        },

        handHandover() {
            console.log(this.$refs.handoverRef);
            this.$refs.handoverRef.openPreviewModel()
        },

        handTerminate() {
            this.$confirm('确定该工单终止?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                updateStatusTerminate([this.newTaskObj.workOrderId]).then(res => {
                    // this.$emit('refresh')
                })
            }).catch(() => {

            })

        },
        outCancel() {
            this.sceneText = "";//委外场景
            this.outsourceForm.outsourceScene = null;
            this.outsourceShow = false
            EventBus.$off('outEvent');
        },

        getNewSteps() {
            this.activeIndex = this.getIndexOfElementInArray(this.stepsList, this.newTaskObj.currentTaskId)

            this.newStepsList = []
            this.stepsList.forEach((f, i) => {
                if (f.taskId != '-1' && f.taskId != '-2' && i > this.activeIndex && (f.type == 1 || f.type ==
                    4)) {
                    this.newStepsList.push(f)
                }
            })

        },

        getIndexOfElementInArray(array, target) {
            for (let i = 0; i < array.length; i++) {
                if (array[i].taskId === target) {
                    return i; // 返回第一次出现target的索引位置
                }
            }
            return -1; // 未找到目标值时返回-1
        },






        // 工艺路线
        produceFn() {
            let param = {
                pageNum: 1,
                size: -1,
                routeType: 2
            }
            producerouting(param).then(res => {
                this.produceList = res.list

            })
        },

        // 仓库 
        getWarehouseFn() {
            getWarehouseList().then(res => {
                this.warehouseList = res
            })
        },


        outsourceOk() {
            if (!this.outsourceForm.name) {
                // uni.showToast({
                //     title: '请输入委外名称',
                //     icon: 'none'
                // })
                return false
            }


            if (!this.outsourceForm.type) {
                // uni.showToast({
                //     title: '请选择委外类型',
                //     icon: 'none'
                // })
                return false
            }





            if (!this.outsourceForm.requireDeliveryTime) {
                // uni.showToast({
                //     title: '请选择委外完成时间',
                //     icon: 'none'
                // })
                return false
            }
            if (this.clientEnvironmentId == 2) {
                this.outsourceForm.isInWarehouse = 1
            } else {
                this.isInWarehouse.length > 0 ? this.outsourceForm.isInWarehouse = 1 : this.outsourceForm
                    .isInWarehouse = 0
            }
            if (this.outsourceForm.requireDeliveryTime.indexOf('00:00:00') === -1) {
                this.outsourceForm.requireDeliveryTime = this.outsourceForm.requireDeliveryTime + '00:00:00';
            }

            let param = {
                ...this.outsourceForm,
                taskId: this.newTaskObj.currentTaskId,
                workOrderId: this.newTaskObj.workOrderId,

            }

            console.log(param)
            this.sceneText = "";//委外场景
            this.outsourceForm.outsourceScene = null;
            this.$refs.outsourceListRef.open(param)



            // let param = {
            // 	...this.outsourceForm,
            // 	taskId: this.newTaskObj.currentTaskId,
            // 	workOrderId: this.newTaskObj.workOrderId,
            // 	isRelease: isRelease
            // }

            // applyoutsourceSave(param).then(res => {
            // 	console.log(res)
            // 	this.outCancel()
            // })
        },


    }
}
</script>

<style lang="scss" scoped>
.bottom_box {
    display: flex;
    justify-content: space-between;
    background: #fff;
}

.nav_box {
    // width: 750px;
    height: 40px;
    // background: $theme-color;

    .open_icon {
        width: 48px;
        height: 48px;
    }

    .open_icon_reversal {
        transform: scaleY(-1);
        /* 垂直翻转 */

    }
}

.operate_list {
    margin: 0 32px;

    .list {
        border-radius: 8px;
        // border: 1px solid $theme-color;
        background: #F0F8F2;
        height: 64px;
        padding: 0px 16px;
        margin-top: 16px;

    }

    .round {
        width: 32px;
        height: 32px;
        line-height: 32px;
        text-align: center;
        border-radius: 50%;
        // background: $theme-color;
        font-size: 24px;
        font-style: normal;
        font-weight: 400;
        color: #fff;
    }

    .name {
        font-family: PingFang HK;
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        // color: $theme-color;
    }

    .arrow_right {
        width: 32px;
        height: 32px;
    }
}

.btn_box {
    display: flex;
    padding: 16px 32px;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;

    .btn {
        width: 160px;
        height: 64px;
        line-height: 64px;
        // background: $theme-color;
        text-align: center;
        border-radius: 8px;
        color: #fff;
        font-family: PingFang HK;
        font-size: 24px;
        font-style: normal;
        font-weight: 600;

    }
}


.operate_box {
    padding: 10px 20px;

}

// /deep/ .u-button {
//     width: 180px;
// }

.popup_list {
    width: 78vw;
    min-height: 360px;
    padding: 0 32px;

    .title {
        color: #333;
        font-size: 32px;
        text-align: center;
        padding: 30px;


    }
}


.list_item_btn {
    width: 160px;
    height: 54px;
    line-height: 54px;
    // background: $theme-color;
    text-align: center;
    border-radius: 8px;
    color: #fff;
    font-family: PingFang HK;
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
}


.content_num {
    display: flex;
    align-items: center;
    padding: 0 4px;

}

// /deep/ .uni-input-input {
//     border: 2px solid #F0F8F2;
//     background: #F0F8F2;
//     // color: $theme-color;
// }</style>