<template>
    <div class="w-full p-4">
        <div class="flex items-center my-2">
            <!-- <h1 class="ml-auto text-2xl font-bold">快速入口：</h1> -->
            <el-button class="ml-auto" type="primary"  @click="router.push('/inquiry/list')">询盘列表</el-button>
            <el-button class="ml-auto" type="default"  @click="router.push('/inquiry/create')">新建询盘</el-button>
            <el-button class="ml-auto" type="success"  @click="router.push('/inquiry/list')">询盘列表</el-button>
            <el-button class="ml-auto" type="danger"  @click="router.push('/inquiry/create')">新建询盘</el-button>
            <el-button class="ml-auto" type="warning"  @click="router.push('/inquiry/list')">询盘列表</el-button>
            <el-button class="ml-auto" type="primary"  @click="router.push('/inquiry/create')">新建询盘</el-button>
        </div>
    </div>
    <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="user_store.userInfo.role == 0 || user_store.userInfo.role == 1" class="flex items-center justify-evenly">
                            <el-dropdown placement="top-start" @command="distribute">
                                <el-button type="primary" size="small">派单</el-button>
                                <template #dropdown>
                                    <el-dropdown-menu>
                                        <el-dropdown-item v-for="item in user_store.teamInfo" :key="item.id" :command="{id: row.id,creator: item.id}">{{ item.name }}</el-dropdown-item>
                                    </el-dropdown-menu>
                                </template>
                            </el-dropdown>
                            <el-button type="danger" size="small" @click="removeInquiry(row.id)">丢弃</el-button>
                            <el-button type="primary" size="small" @click="subject_info(row)">摘要</el-button>
                        </div>
                        <div v-else class="flex justify-center items-center">
                            <el-button type="primary" size="small" @click="grabInquiry(row.id)">抢单</el-button>
                            <el-button type="primary" size="small" @click="subject_info(row)">摘要</el-button>
                        </div>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
        <el-card shadow="hover" class="p-4 overflow-y-auto" :style="{height: cardHeight + 'px'}">
            <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="user_store.isAdmin">
                    <template #default="{row}">
                        <span>{{ user_store.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="user_store.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>
                            <!-- <el-button type="primary" size="small" @click="subject_info(row)">摘要</el-button> -->
                        </div>
                        <div v-else class="flex justify-center items-center">
                            <el-button type="primary" size="small" @click="() => {}">结单</el-button>
                            <!-- <el-button type="primary" size="small" @click="subject_info(row)">摘要</el-button> -->
                        </div>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
    </div>
</template>

<script setup>
    import { ref,onMounted,h } from 'vue'
    import { useRouter } from 'vue-router'
    import { useUserStore } from '@/store'
    import { inquiryFilter,update,grab,subject } from '@/api/inquiry'
    import { getAssetsImages } from '@/utils'
    import { ElMessage,ElMessageBox } from 'element-plus'
    import { addLog } from '@/api'

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

    const router = useRouter()
    const user_store = 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(`${user_store.team.join(',')}`,'process',7)
        if (res.error === 0) {
            processing_inquiry.value = res.data
        } else {
            processing_inquiry.value = []
        }
    }

    const distribute = async ({id,creator}) => {
        const {data: res} = await update(id,{creator})
        if (res.error == 0) {
            ElMessage.success('分派成功')
            await addLog(id,user_store.userId,'distribute',`${creator}`)
            await getInquiryList()
            await getProcessingInquiryList()
        } else {
            ElMessage.error(res.msg || '分派失败，请稍后重试')
        }
    }

    const grabInquiry = async (id) => {
        const {data: res} = await grab(id,user_store.userId)
        if (res.error == 0) {
            ElMessage.success('抢单成功')
            await addLog(id,user_store.userId,'grab',`${user_store.userId}`)
            await getInquiryList()
            await getProcessingInquiryList()
        } else {
            ElMessage.error(res.msg || '抢单失败，请稍后重试')
        }
    }
    const removeInquiry = async (id) => {
        ElMessageBox.prompt('请输入删除理由', '提示',{
            confirmButtonText: '删除',
            cancelButtonText: '取消',
        }).then(async ({ value }) => {
            const {data: res} = await update(id,{subject: value,is_del: 1})
            if (res.error == 0) {
                await addLog(id,`${user_store.userName}(${user_store.userId})`,'删除询盘',value)
                ElMessage.success('删除成功!')
            } else {
                ElMessage.error(res.msg || '删除失败，请稍后重试')
            }
        }).catch(() => {
            ElMessage.info('删除已取消')
        })
    }
    const subject_info = async (row) => {
        let id = row.id
        const {data: res} = await subject(id)
        if (res.error == 0) {
            ElMessage.success('获取摘要成功')
            let info = ''
            let info_arr = []
            let all = 0
            res.data.forEach(item => {
                if(item.id == 0) {
                    info_arr.push(`<b style="color: #F00">无品牌</b>商品${item.count}项`)
                } else {
                    info_arr.push(`<b style="color: #00F">${item.name}</b>商品${item.count}项`)
                }
                all += item.count
            })
            info = `全部商品${all}项，其中：${info_arr.join('；')}。`
            ElMessageBox({
                title: '询盘摘要',
                message: info,
                type: 'info',
                confirmButtonText: '知道了',
                dangerouslyUseHTMLString: true,
            })
        } else {
            ElMessage.error(res.msg || '获取摘要失败，请稍后重试')
        }
    }

    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>