<template>
    <div class="w-full grid grid-cols-3 flex gap-4 p-4">
        <el-card shadow="hover" :style="{height: cardHeight + 'px'}">
            <template #header>
                <div class="flex items-center px-4 justify-between">
                    <div class="font-bold text-lg">7日内待分派询盘单</div>
                    <el-button type="primary" size="small" @click="getInquiryList">刷新</el-button>
                </div>
            </template>
            <el-table
                :data="allocating_inquiry"
                border
                :height="tableHeight"
                size="small"
                class="w-full pb-2"
            >
                <el-table-column type="index" label="#" width="40" header-align="center" align="center" :index="1"></el-table-column>
                <el-table-column prop="order_no" label="询单尾号" width="80" header-align="center" align="center">
                    <template #default="{row}">
                        <span>{{ row.order_no.slice(12) }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="true_name" label="客户名称" width="120" header-align="center" show-overflow-tooltip>
                    <template #default="{row}">
                        <span>{{ row.true_name ? row.true_name : row.user_name }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="create_time" label="创建时间" width="160" header-align="center"></el-table-column>
                <el-table-column label="操作" header-align="center">
                    <template #default="{row}">
                        <div v-if="userStore.userInfo.role == '0' || userStore.userInfo.role == '1'" class="flex items-center justify-evenly">
                            <el-button type="primary" size="small" @click="() => {}">派单</el-button>
                            <el-button type="danger" size="small" @click="() => {}">丢弃</el-button>
                        </div>
                        <div v-else class="flex justify-center items-center">
                            <el-button type="primary" size="small" @click="() => {}">抢单</el-button>
                        </div>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
        <el-card shadow="hover" class="p-4">
            <div class="grid grid-cols-4 items-center gap-20px">
                <a v-for="items in menuItems" :key="items.title" :href="items.url" target="_blank">
                    <div class="flex flex-col items-center">
                        <img :src="getAssetsImages(items.icon)" class="w-60px h-60px" alt="">
                        <span class="mt-4 hover:scale-105 hover:text-green-700 hover:font-bold">{{ items.title }}</span>
                    </div>
                </a>
            </div>
        </el-card>
        <el-card shadow="hover" :style="{height: cardHeight + 'px'}">
            <template #header>
                <div class="flex items-center px-4 justify-between">
                    <div class="font-bold text-lg">7日内待完成询盘单</div>
                    <el-button type="primary" size="small" @click="getProcessingInquiryList">刷新</el-button>
                </div>
            </template>
            <el-table
                :data="processing_inquiry"
                border
                :height="tableHeight"
                size="small"
                class="w-full pb-2"
            >
                <el-table-column type="index" label="#" width="40" header-align="center" align="center" :index="1"></el-table-column>
                <el-table-column prop="order_no" label="询单尾号" width="80" header-align="center" align="center">
                    <template #default="{row}">
                        <span>{{ row.order_no.slice(12) }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="true_name" label="客户名称" width="120" header-align="center" show-overflow-tooltip>
                    <template #default="{row}">
                        <span>{{ row.true_name ? row.true_name : row.user_name }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="业务主办" width="80" header-align="center" align="center" show-overflow-tooltip v-if="userStore.isAdmin">
                    <template #default="{row}">
                        <span>{{ userStore.teamInfo[row.creator]?.name || '未知'  }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="工作节点" width="80" header-align="center" align="center">
                    <template #default="{row}">
                        <span>{{ row.status == 0 ? '未开始' : row.status == 1 ? '待报价': row.status == 3 ? '已报价' : '其他' }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="create_time" label="创建时间" width="160" header-align="center"></el-table-column>
                <el-table-column label="操作" header-align="center">
                    <template #default="{row}">
                        <div v-if="userStore.isAdmin" class="flex items-center justify-evenly">
                            <el-button type="primary" size="small" @click="() => {}">处理</el-button>
                            <el-button type="danger" size="small" @click="() => {}">结单</el-button>
                        </div>
                        <div v-else class="flex justify-center items-center">
                            <el-button type="primary" size="small" @click="() => {}">结单</el-button>
                        </div>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
    </div>
</template>

<script setup>
    import { ref,onMounted } from 'vue'
    import { useRouter } from 'vue-router'
    import { useUserStore } from '@/store'
    import { inquiryFilter } from '@/api/inquiry'
    import { getAssetsImages } from '@/utils'

    const cardHeight = ref(420)
    const tableHeight = ref(320)

    const router = useRouter()
    const userStore = useUserStore()

    const allocating_inquiry = ref([])
    const processing_inquiry = ref([])
    onMounted(async () => {
        await getInquiryList()
        await getProcessingInquiryList()
    })

    const getInquiryList = async () => {
        const {data: res} = await inquiryFilter('0','start',7)
        if (res.error === 0) {
            allocating_inquiry.value = res.data
        } else {
            allocating_inquiry.value = []
        }
    }

    const getProcessingInquiryList = async () => {
        const {data: res} = await inquiryFilter(`${userStore.team.join(',')}`,'process',7)
        if (res.error === 0) {
            processing_inquiry.value = res.data
        } else {
            processing_inquiry.value = []
        }
    }

    const menuItems = ref([
        {'title': '批量查件','icon': '批量查件.png','url': 'https://www.jifuyun.cn/sitex/search','_blank': false},
        {'title': '查件订单','icon': '查件订单.png','url': 'https://www.jifuyun.cn/ucenterx/preorder','_blank': false},
        {'title': '可视检索','icon': '可视检索.png','url': 'https://epc.jifuyun.cn','_blank': false},
        {'title': '收藏关注','icon': '收藏关注.png','url': 'https://www.jifuyun.cn/ucenterx/user_cart','_blank': false},
        {'title': '发布闲置','icon': '发布闲置.png','url': 'https://www.jifuyun.cn/sitex/upspareparts','_blank': false},
        {'title': '我的设备','icon': '我的设备.png','url': 'https://www.jifuyun.cn/ucenterx/device','_blank': false},
        {'title': '附近服务','icon': '附近服务.png','url': 'https://www.jifuyun.cn/sitex/nearest','_blank': false},
        {'title': '机服云主站','icon': 'jifuyun.cn.png','url': 'https://www.jifuyun.cn','_blank': false},
        {'title': '数据后台','icon': '数据处理.png','url': 'https://adm.jifuyun.cn','_blank': false},
        {'title': '询盘订单','icon': '预报价单.png','url': 'https://m2.jifuyun.cn','_blank': false},
        {'title': '机联商家','icon': '商户管理 (1).png','url': 'https://sh.jifuyun.cn','_blank': false},
        {'title': '供应商','icon': '工作台-报价.png','url': 'https://g.jifuyun.cn','_blank': false},
        {'title': '可视化检索','icon': '装配工单.png','url': 'https://epc.jifuyun.cn','_blank': false},
        {'title': '寻件通','icon': 'aim.png','url': 'https://xjt.jifuyun.cn/admin/index','_blank': false},
        {'title': '旧版后台','icon': '系统管理.png','url': 'https://www.jifuyun.cn/admin/index','_blank': false}
    ])

</script>

<style lang="scss" scoped>

</style>