<!--
 * @Author: micky
 * @Date: 2024-10-06 10:33:23
 * @LastEditors: micky
 * @LastEditTime: 2024-10-29 16:28:21
 * @FilePath: \chargingpile-uniapp\src\bundle\pages\charge\info-check.vue
-->
<template>
    <w-page-common
        btnText="确认核对"
        @submit="handleSubmit"
        :needPadding="false"
        :btnDisabled="dataList.length === 0"
    >
        <view class="bg-[#fffbe8] text-error px-3 py-1 text-base mb-4">
            扫描模块条码即可完成核对
        </view>
        <!-- 开发用，后续要删掉 -->
        <u-input v-model="scanResultCode" placeholder="请输入测试模块代码"></u-input>
        <w-scan v-model="scanResultCode"></w-scan>
        <view v-if="dataList.length > 0" class="text-3xl font-bold my-3 text-center">
            {{ response.clientName }}
        </view>
        <view class="p-4">
            <view class="item" v-for="(item, index) in dataList" :key="index">
                <view class="text-xl mb-2 pl-1" v-if="showName(index)">{{ item.name }}</view>
                <TCard :cardStyle="{ marginBottom: '8px' }">
                    <view class="c-form-item-wrapper py-[24rpx]">
                        <view class="item black">
                            <view>模块代码</view>
                            <view>{{ item.moduleCode }}</view>
                        </view>
                        <view class="item black">
                            <view>型号</view>
                            <view>{{ item.moduleNumber }}</view>
                        </view>
                        <view class="item black">
                            <view>功率</view>
                            <view>{{ parseModulePower(item.modulePower) }}</view>
                        </view>
                    </view>
                    <view class="btns" v-if="item.reviewRequest != 0">
                        <view
                            v-for="(dict, index) in optionsMap.infoCheckOptions"
                            :key="index"
                            class="btn"
                            :class="item.type == dict.value ? 'active' : ''"
                            @click="item.type = dict.value"
                        >
                            {{ dict.label }}
                        </view>
                    </view>
                    <view class="btns" v-else>
                        <view class="btn active">
                            {{ optionsMap.infoCheckOptions[0].label }}
                        </view>
                    </view>
                    <view
                        class="reason border-t border-[#fafafe] border-[2px] py-3 px-5"
                        v-if="item.type == InfoCheckEnum.RETURN"
                    >
                        <u-input
                            placeholder="请输入返修原因"
                            v-model="item.returnReason"
                            shape="circle"
                        ></u-input>
                    </view>
                </TCard>
            </view>
        </view>
        <w-confirm-popup :contentText="contentText" v-model="show" @confirm="confirmAdd" />
    </w-page-common>
</template>

<script setup lang="ts">
import { ref, watch, unref, computed } from 'vue'
import { optionsMap } from '@/config/options'
import {
    InfoCheckEnum,
    auditItemsClassifyMap,
    RepairOrderStatusEnum,
    RepaireOrderAuditStatusEnum
} from '@/enums/businessEnums'
import { apiInfoCheck } from '@/api/charge'
import { apiRepairDetail } from '@/api/repair'
import { toast } from '@/utils/util'
import { useModulePower } from '@/hooks/useLockFn'
import { useToggle } from '@/hooks/useLockFn'
const { show, handleToggle } = useToggle()

const dataList = ref<any>([])
const response = ref<Partial<RepairItem>>({})
const scanResultCode = ref('')
const { parseModulePower } = useModulePower()

const contentText = computed(() => {
    return `当前扫描的模块属于【${response.value.clientName}】，是否确认核对该公司下的其他模块？`
})

const showName = (ind: number) => {
    return dataList.value[ind].name != dataList.value[ind - 1]?.name
}

const handleSubmit = async () => {
    const obj = dataList.value.find(item => item.type == InfoCheckEnum.RETURN && !item.returnReason)
    if (obj) return toast('请输入返修原因')
    const params = dataList.value.map(item => {
        return {
            id: item.id,
            type: item.type,
            returnReason: item.returnReason
        }
    })
    console.log('params', params)

    await apiInfoCheck({
        repairOrderList: params
    })
    toast('核对成功')
    setTimeout(() => {
        uni.navigateBack()
    }, 300)
}

const getDetail = async () => {
    const res = await apiRepairDetail({
        moduleCode: unref(scanResultCode),
        isClient: 2
    })
    response.value = res

    if (dataList.value.length === 0) {
        if (res.orderStatus == RepairOrderStatusEnum.COMPLETE) return toast('该维修单已完成！')
        else if (res.auditStatus != RepaireOrderAuditStatusEnum.STOCKPENDING)
            return toast('该维修单当前状态不允许信息核对！')
        handleToggle(false)
    } else {
        if (res.clientId != dataList.value[0].clientId)
            return toast(`当前只能核对【${dataList.value[0].clientName}】下的模块`)
        else if (res.orderStatus == RepairOrderStatusEnum.COMPLETE) return toast('该维修单已完成！')
        else if (res.auditStatus != RepaireOrderAuditStatusEnum.STOCKPENDING)
            return toast('该维修单当前状态不允许信息核对！')
        addItem()
    }
}

const confirmAdd = () => {
    addItem()
}

const addItem = () => {
    const res = response.value
    const ind = Math.max(
        dataList.value.findIndex(i => i.reviewRequest == res.reviewRequest),
        0
    )
    dataList.value.splice(ind, 0, {
        name: auditItemsClassifyMap[res.reviewRequest!],
        clientName: res.clientName,
        clientId: res.clientId,
        moduleCode: res.moduleCode,
        moduleNumber: res.moduleNumber,
        modulePower: res.modulePower,
        type: 0,
        returnReason: '',
        id: res.id,
        reviewRequest: res.reviewRequest
    })
}
watch(scanResultCode, val => {
    const obj = dataList.value.find(item => item.moduleCode == val)
    if (obj) return toast('该模块码已存在')
    getDetail()
})
</script>
<style scoped lang="scss">
.btns {
    @apply flex justify-between items-center pb-3 px-4 gap-3;
    .btn {
        @apply flex-1 border border-[#D5D5D5] h-[36px] leading-[36px] rounded text-center;
        &.active {
            @apply bg-[#F0F0FB] border-none text-primary;
        }
    }
}
</style>
