<template>
    <div class="content">
        【装备强化】<br>
        名称: <GameEqu :equ-data="equData" :show-url="false"></GameEqu><br>
        <span v-if="equData.equName != equData.unitEquName">
            装备名称:{{ equData.unitEquName }}<br>
        </span>
        部位:{{ EquTool.GetEquPlaceName(equData.code) }}<br>
        等级:{{ equData.lev }}<br>
    </div>
    <div class="content">
        当前强化等级:{{ equData.intensifyLev }}
    </div>
    <div class="content" v-if="isMax == false">
        ➢强化所需:<br>
        <div class="common" v-for="item in needs">
            <span v-if="item.code == 'Goods'">
                ▸<Abar :href='"/prop/goods?id=" + item.parameter'>{{ item.name }}</Abar>:({{ item.onCount }}/{{
                    item.count }})
                <span style="color: red;" v-if="item.isAsk == 0">(不满足)</span>
            </span>
            <span v-else-if="item.code == 'copper'">
                ▸{{ item.name }}:({{ GameTool.FormatCopper(item.onCount) }}/ {{ GameTool.FormatCopper(item.count) }})
                <span style="color: red;" v-if="item.isAsk == 0">(不满足)</span>
            </span>
            <span v-else>
                ▸{{ item.name }}:({{ item.onCount }}/{{ item.count }})
                <span style="color: red;" v-if="item.isAsk == 0">(不满足)</span>
            </span>
            <span v-if="item.needItem.length > 0">
                <Abutton @click="ChangeProp(item)">更换</Abutton>
            </span>
        </div>
    </div>
    <div class="content" v-if="isMax == isMax && verifyData.result == true">
        [<Abutton @click="btnHandleEquUp">立即强化</Abutton>]
    </div>
    <div class="clear"></div>
    <div class="content" style="font-size: 16px;;">
        强化说明:<br>
        1.强化仅在成功后扣除(正)龙泉水。<br>
        2.强化等级上限100级。<br>
        3.强化所需的其他材料可以通过游戏内获得，龙泉水可以通过商城/活动获得。<br>
        4.使用龙泉水装备会不可交易,使用正龙泉水装备自动为可交易状态。<br>
    </div>

    <GamePopup v-model:show="showChange" title="【更换材料】" style="width: 60%;max-height: 30%;">
        <!-- 自定义内容 -->
        <div class="content" style="max-height: 300px;margin-top: 15px;;">
            <div class="item" v-for="(item, index) in changeData" :key="index">
                {{ index + 1 }}.<Abutton @click="ChangePropOk(item)">{{ item.name }}×{{ item.count }}</Abutton>
            </div>
        </div>
    </GamePopup>
</template>
<script setup lang="ts">

definePageMeta({
    layout: layout.default,
    middleware: 'page-loading'
})
const equData = ref<any>({});
const isMax = ref(true);
const verifyData = ref<any>({});
const needs = ref<Array<any>>([]);

let ueId = PageExtend.QueryString("ue");
onMounted(async () => {
    try {
        await BindData();
    }
    finally {
        PageLoading.Close();
    }
})
const BindData = async (): Promise<void> => {
    let result = await EquService.GetEquUpInfo(ueId);    
    if (result.code == 0) {
        equData.value = result.data.equData;
        isMax.value = result.data.isMax;
        verifyData.value = result.data.result;
        needs.value = verifyData.value.needs;
    }
    else {
        MessageExtend.ShowDialogEvent("强化装备", result.msg, () => {
            PageExtend.RedirectTo("/prop/equ?ue=" + ueId);
        });
    }
};
const changeNum = ref(0);
const changeData = ref<Array<any>>([]);
const showChange = ref(false);
const ChangeProp = (data: any) => {
    changeNum.value = data.id;
    changeData.value = data.needItem;
    showChange.value = true;
}

const ChangePropOk = async (data: any) => {
    MessageExtend.LoadingToast("更换中...");
    needs.value.forEach(it => {
        if (it.id == changeNum.value) {
            it.name = data.name;
            it.code = data.code;
            it.parameter = data.parameter;
            it.count = data.count;
        }
    });
    let _needs = JSON.stringify(needs.value);
    let result = await BagService.CheckUserProp(_needs);    
    MessageExtend.LoadingClose();
    if (result.code == 0) {
        verifyData.value = result.data;
        needs.value = verifyData.value.needs;
        showChange.value = false;
    }
    else {
        MessageExtend.ShowDialog("材料更换", result.msg);
    }
}

/**强化装备 */
const btnHandleEquUp = async () => {
    MessageExtend.LoadingToast("强化中...");
    let _needs = JSON.stringify(needs.value);
    let result = await EquService.HandleEquUp(ueId, _needs);
    MessageExtend.LoadingClose();
    if (result.code == 0) {
        if (result.data.state == 1) {
            MessageExtend.ShowToast("强化成功!", "success");
        }
        else {
            MessageExtend.ShowToast("强化失败!", "fail");
        }
        equData.value = result.data.equData;
        isMax.value = result.data.isMax;
        verifyData.value = result.data.result;
        needs.value = verifyData.value.needs;

    }
    else {
        MessageExtend.ShowDialog("强化装备", result.msg);
    }
}
</script>