<template>
    <div id="DeviceSelect">
        <el-dropdown trigger="click" @command="selectDeviceInfo">
            <span class="el-dropdown-link">
                {{ deviceName
                }}<i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <el-dropdown-menu
                slot="dropdown"
                style="width: 240px; height: 350px; overflow: auto"
            >
                <el-dropdown-item
                    :command="l.deviceKey"
                    v-bind:key="l.deviceKey"
                    v-for="l in deviceList"
                    style="font-size: 1rem; padding: 2px 10px"
                    >{{ l.deviceLabel }}
                </el-dropdown-item>
            </el-dropdown-menu>
        </el-dropdown>
    </div>
</template>

<script>
import cache from "@/utils/cache";
import { AxiosRequestData } from "../../../data/axios_request";

export default {
    name: "index",
    data() {
        return {
            deviceName: "",
            entTaxId: "",
            deviceList: {},
            token: "",
        };
    },
    created() {
        this.token = cache.getToken();
        this.getDefaultDevice();
        this.getDeviceList();
    },
    methods: {
        // 获取默认设备信息
        async getDefaultDevice() {
            let company = JSON.parse(cache.getSession("company"));
            if (company) {
                this.deviceName = company.defaultDeviceInfo.deviceLabel;
                this.entTaxId = company.entTaxId;
            }
        },
        // 获取设备列表
        async getDeviceList() {
            let company = JSON.parse(cache.getSession("company"));
            if (company && this.token) {
                const url = "/sys/entDevice/findDevices";
                let response = await AxiosRequestData(
                    url,
                    this.token,
                    {
                        entTaxId: company.entTaxId,
                    },
                    false,
                    2
                );
                if (response) {
                    if (response.code === 0) {
                        // let listDatas = response.data.map((_, i) => ({
                        //     deviceKey: response.data[i].deviceKey,
                        //     deviceLabel: response.data[i].deviceLabel,
                        // }));
                        // initStatus 表示开票设备已下架
                        let listDatas = response.data.filter(
                            (item) => item.initStatus != 6
                        );
                        this.deviceList = listDatas;
                        cache.setSession("devices", response.data);
                        console.log("设备列表：");
                        console.log(response.data);
                    }
                }
            }
        },
        // 设置默认开票设备信息
        async setDefaultDevice(deviceKey) {
            if (this.entTaxId && this.token) {
                const url = "/sys/entInfo/setDefaultDevice";
                let response = await AxiosRequestData(
                    url,
                    this.token,
                    {
                        entTaxId: this.entTaxId,
                        deviceKey: deviceKey,
                    },
                    false,
                    1
                );
                if (response) {
                    if (response.code === 0) {
                        this.deviceName = response.data.deviceLabel;
                        await this.getDefaultCompany();
                    }
                }
            }
        },
        // 切换默认开票设备信息
        selectDeviceInfo(command) {
            console.log("设备信息：");
            console.log(command);
            this.setDefaultDevice(command);
        },
        // 获取默认企业信息
        async getDefaultCompany() {
            let user = JSON.parse(cache.getSession("user"));
            if (user && this.token) {
                const url = "/auth/comm/user/findDefaultChoose";
                let response = await AxiosRequestData(
                    url,
                    this.token,
                    {
                        mobile: user.account,
                    },
                    false,
                    2
                );
                if (response) {
                    if (response.code === 0) {
                        cache.setSession("company", response.data);
                        location.reload();
                    }
                }
            }
        },
    },
};
</script>

<style scoped>
.el-dropdown-link {
    cursor: pointer;
    /* color: #409EFF; */
    color: #004080;
    font-size: 1rem;
    /* font-weight:bold; */
}

.el-icon-arrow-down {
    font-size: 12px;
}
</style>
