<template>
    <Cn-page :loading='loading'>
        <view slot='body'>
            <view class='select-enineering'>
                <uni-indexed-list
                    :options="engineeringListFilter"
                    :showSelect="false"
                    @click="confirm"
                    ></uni-indexed-list>
            </view>
        </view>
    </Cn-page>
</template>
<script>
import {pinyin} from 'pinyin-pro'
export default {
    data() {
        return {
            loading: false,
            engineeringList:[]
        }
    },
    computed: {
        engineeringListFilter() {
            let result = []
            this.engineeringList.forEach((item) => {
                let arr = pinyin(item.name[0], {toneType: 'none', type: 'array'})
                let letter = arr[0][0].toUpperCase()
                console.log(letter)
                let index = result.findIndex((item) => item.letter === letter)
                if (index === -1) {
                    result.push({
                        letter,
                        data: [item.name],
                    })
                } else {
                    result[index].data.push(item.name)
                }
            })
            return result
        },
    },
    onLoad(){
        this.engineeringList = uni.getStorageSync('engineeringList')
    },
    methods: {
        confirm(e) {
            console.log(e)
            let engineering = this.engineeringList.find((item) => item.name === e.item.name)
            uni.setStorageSync('engineering', engineering)
            uni.navigateBack()
        },
    }
}
</script>
<style lang='scss'>
.index {
    padding: 34rpx;
}
</style>