<template>
    <div class="content">
        【套装介绍】
    </div>
    <div class="content">
        套装名称：{{ data.suitName }}<br>
        套装介绍：<span v-html="data.sign"></span><br>
    </div>
    <div class="content">
        ---◈套装部件◈---<br>
        <div class="item" v-for="item in onEqu">
            ▸<Abar :href='"/prop/equ?id=" + item.equId'>{{ item.equName }}</Abar>
        </div>
    </div>
    <div class="content">
        ---◈套装属性◈---<br>
        <div v-for="item in suitAttr">
            <div class="content" v-for="attr in item.attrItem">
                <span>{{ item.type == 0 ? "✧" : "✡" }}</span>
                <span>{{ attr.tip }}</span>
            </div>
        </div>
    </div>
     <div class="content">
        ---◈已激活属性◈---<br>
        <div v-for="item in OnSuitAttr">
            <div class="content" v-for="attr in item.attrItem">
                <span>{{ item.type == 0 ? "✧" : "✡" }}</span>
                <span>{{ attr.tip }}</span>
            </div>
        </div>
    </div>
</template>
<script setup lang="ts">

definePageMeta({
    layout: layout.default,
    middleware: 'page-loading'
})
const data = ref<any>({});
const onEqu = ref<Array<any>>([]);
const suitAttr = ref<Array<any>>([]);
const OnSuitAttr = ref<Array<any>>([]);
onMounted(async () => {
    try {
        await BindData();
    }
    finally {
        PageLoading.Close();
    }
})



const BindData = async (): Promise<void> => {
    let suitCode = PageExtend.QueryString("id");
    let result = await EquService.GetUserOnSuitInfo(suitCode);    
    if (result.code == 0) {
        data.value = result.data.data;
        onEqu.value = data.value.onEqu;
        suitAttr.value = data.value.attr;
        OnSuitAttr.value = result.data.suit.suitAttr;
    }
    else {
        MessageExtend.ShowDialog("提示", result.msg);
    }
};
</script>