<template>
    <div class="article-edit">
        <el-card class="!border-none" shadow="never">
            <el-page-header :content="$route.meta.title" @back="$router.back()" />
        </el-card>

        <el-form ref="formRef" label-width="120px">
            <el-card class="!border-none mt-4" shadow="never">
                <div class="font-medium mb-7">订单</div>
                <el-form-item label="订单编号"> {{ order.order_sn }} </el-form-item>
                <el-form-item label="订单类型"> {{ order.type == 1 ? '完成订单' : '部分退款订单' }} </el-form-item>
            </el-card>

            <el-card class="!border-none mt-4" shadow="never">
                <div class="font-medium mb-7">实际营收</div>
                <el-form-item label="实际营收"> {{ order.platform_income }} </el-form-item>
            </el-card>

            <el-card class="!border-none mt-4" shadow="never">
                <div class="font-medium mb-7">茶艺师</div>
                <el-form-item label="名称"> {{ order.teamaster_user.nickname }} </el-form-item>
                <el-form-item label="手机号"> {{ order.teamaster_user.mobile }} </el-form-item>
                <el-form-item label="分佣金额"> {{ order.tea_master_commission }} </el-form-item>
            </el-card>

            <el-card class="!border-none mt-4" shadow="never">
                <div class="font-medium mb-7">合伙人</div>
                <el-form-item label="名称"> {{ order.parten.name }} </el-form-item>
                <el-form-item label="账号"> {{ order.parten.account }} </el-form-item>
                <el-form-item label="分佣金额"> {{ order.city_partner_commission }} </el-form-item>
            </el-card>

            <el-card class="!border-none mt-4" shadow="never">
                <div class="font-medium mb-7">经济人</div>
                <el-form-item label="名称"> {{ order.broker.name }} </el-form-item>
                <el-form-item label="账号"> {{ order.broker.account }} </el-form-item>
                <el-form-item label="分佣金额"> {{ order.tea_master_agent_commission }} </el-form-item>
            </el-card>

            <el-card class="!border-none mt-4" shadow="never">
                <div class="font-medium mb-7">茶室</div>
                <el-form-item label="名称"> {{ order.tea_store.name }} </el-form-item>
                <el-form-item label="手机号"> {{ order.tea_store.contact_phone }} </el-form-item>
                <el-form-item label="地址"> {{ order.tea_store.province }} {{ order.tea_store.city }} {{
                    order.tea_store.district }} {{ order.tea_store.address }}</el-form-item>
                <el-form-item label="分佣金额"> {{ order.tea_room_commission }} </el-form-item>
            </el-card>

            <el-card class="!border-none mt-4" shadow="never">
                <div class="font-medium mb-7">平台</div>
                <el-form-item label="分佣金额"> {{ order.platform_commission }} </el-form-item>
            </el-card>

            <el-card class="!border-none mt-4" shadow="never">
                <div class="font-medium mb-7">用户信息</div>
                <el-form-item label="昵称"> {{ order.user.nickname }} </el-form-item>
                <el-form-item label="手机号"> {{ order.user.mobile }} </el-form-item>
            </el-card>
        </el-form>
    </div>
</template>

<script lang="ts" setup>
import { useDictData } from '@/hooks/useDictOptions'

// 获取字典数据
const { dictData } = useDictData('is_teacup,pay_way,order_status,pay_status')

const route = useRoute()
const order = JSON.parse(route.query.params as string)

// 获取服务方式标签
const getServerTypeLabel = (value: number | string) => {
    const serverTypeMap: Record<number | string, string> = {
        1: '到店服务',
        2: '上门服务',
        3: '全部'
    }
    return serverTypeMap[value] || value
}
</script>
