{include file="/shopro/common/script" /}

<div id="index" class="reward-index panel panel-default panel-intro" v-cloak>
    <el-container class="panel-block">
        <el-header class="sa-header">
            <div class="sa-title sa-flex sa-row-between">
                <div class="sa-title-left">
                    <div class="left-name">收益流水</div>
                    <sa-filter-condition v-model="state.filter" @filter-delete="onChangeFilter">
                    </sa-filter-condition>
                </div>
                <div class="sa-title-right">
                    <el-button class="sa-button-refresh" icon="RefreshRight" @click="getData"></el-button>
                    <el-button class="sa-button-refresh" icon="Search" @click="onOpenFilter"></el-button>
                    {if $auth->check('shopro/partner/reward/export')}
                    <el-button :loading="exportLoading" :disabled="exportLoading" @click="onExport('export')">导出
                    </el-button>
                    {/if}
                    {if $auth->check('shopro/partner/reward/reissue')}
                    <el-button type="primary" @click="reissue.visible = true">手工补发</el-button>
                    {/if}
                </div>
            </div>
        </el-header>
        <el-main class="sa-main">
            <el-table height="100%" class="sa-table" :data="state.data" stripe>
                <el-table-column prop="id" label="ID" min-width="80"></el-table-column>
                <el-table-column prop="createtime" label="入账时间" width="172"></el-table-column>
                <el-table-column label="受益人" min-width="150">
                    <template #default="scope">
                        <sa-user-profile :user="scope.row.user" :id="scope.row.user_id"></sa-user-profile>
                    </template>
                </el-table-column>
                <el-table-column label="买家" min-width="150">
                    <template #default="scope">
                        <sa-user-profile :user="scope.row.buyer" :id="scope.row.buyer_id"></sa-user-profile>
                    </template>
                </el-table-column>
                <el-table-column label="订单" min-width="190">
                    <template #default="scope">
                        <div v-if="scope.row.order_id > 0" class="sa-flex sa-row-between">
                            <el-link type="primary" :underline="false" @click="onOrderTree(scope.row)">
                                {{ scope.row.order?.order_sn || scope.row.order_id }}
                            </el-link>
                            <el-button type="primary" link size="small" @click="onOrderTree(scope.row)">透视</el-button>
                        </div>
                        <span v-else>{{ scope.row.order?.order_sn || scope.row.order_id }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="reward_type_text" label="奖励类型" min-width="120"></el-table-column>
                <el-table-column prop="role_text" label="受益身份" min-width="80"></el-table-column>
                <el-table-column label="结算金额" min-width="90">
                    <template #default="scope"> {{ scope.row.amount }} </template>
                </el-table-column>
                <el-table-column label="入账账户" min-width="110">
                    <template #default="scope">
                        <el-tag
                            size="small"
                            :type="scope.row.wallet_type === 'money' ? 'success' : (scope.row.wallet_type === 'madow' ? 'primary' : (scope.row.wallet_type === 'commission' ? 'warning' : 'info'))"
                        >
                            {{ scope.row.wallet_type_text || (Number(scope.row.amount) > 0 ? '钱包余额' : (Number(scope.row.madow) > 0 ? '分红dmepa' : '消费补贴')) }}
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column label="dmepa (枚)" min-width="110">
                    <template #default="scope"> {{ scope.row.madow }} </template>
                </el-table-column>
                <el-table-column prop="base_amount" label="基数" min-width="80"></el-table-column>
                <el-table-column label="状态" min-width="80">
                    <template #default="scope">
                        <span :class="`sa-color--${state.statusStyle[scope.row.status]}`">
                            {{ scope.row.status_text }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column prop="formula" label="测算摘要" min-width="200"></el-table-column>
                <el-table-column label="操作" min-width="180" fixed="right">
                    <template #default="scope">
                        <el-button v-if="scope.row.order_id > 0" type="primary" link @click="onOrderTree(scope.row)">整单透视</el-button>
                        <el-button type="primary" link @click="onViewExt(scope.row)">测算明细</el-button>
                        {if $auth->check('shopro/partner/reward/back')}
                        <el-button v-if="scope.row.status==1 && !scope.row.settle_date" type="danger" link
                            @click="onBack(scope.row)">退回</el-button>
                        {/if}
                        {if $auth->check('shopro/partner/reward/back')}
                        <el-button v-if="scope.row.order_id>0 && scope.row.status==1 && !scope.row.settle_date" type="danger" link
                            @click="onBackOrder(scope.row)">整单退回</el-button>
                        {/if}
                    </template>
                </el-table-column>
            </el-table>
        </el-main>
        <el-footer class="sa-footer sa-flex sa-row-right">
            <sa-pagination v-model="pagination" @pagination-change="getData"></sa-pagination>
        </el-footer>
    </el-container>
    <sa-filter v-model="state.filter" @filter-change="onChangeFilter"></sa-filter>
    <el-dialog v-model="ext.visible" title="测算明细" width="520px">
        <pre style="white-space:pre-wrap">{{ ext.text }}</pre>
    </el-dialog>
    <el-dialog v-model="reissue.visible" title="手工补发" width="480px">
        <el-form label-width="90px">
            <el-form-item label="用户ID"><el-input v-model="reissue.form.user_id"></el-input></el-form-item>
            <el-form-item label="奖励类型"><el-input v-model="reissue.form.reward_type" placeholder="如 push3"></el-input></el-form-item>
            <el-form-item label="金额"><el-input v-model="reissue.form.amount"></el-input></el-form-item>
            <el-form-item label="订单ID"><el-input v-model="reissue.form.order_id"></el-input></el-form-item>
            <el-form-item label="备注"><el-input v-model="reissue.form.memo" type="textarea"></el-input></el-form-item>
        </el-form>
        <template #footer>
            <el-button @click="reissue.visible=false">取消</el-button>
            <el-button type="primary" @click="onReissue">确定</el-button>
        </template>
    </el-dialog>
    <el-dialog v-model="orderTreeDialog.visible" title="订单服务收益透视（结算明细树）" width="860px" destroy-on-close>
        <div v-loading="orderTreeDialog.loading">
            <div style="background:#f8f9fa;padding:14px;border-radius:6px;margin-bottom:16px;">
                <el-row :gutter="16">
                    <el-col :span="6">
                        <div style="color:#909399;font-size:12px;">订单编号</div>
                        <div style="font-weight:600;font-size:13px;margin-top:4px;">{{ orderTreeDialog.data.order?.order_sn || '-' }}</div>
                    </el-col>
                    <el-col :span="6">
                        <div style="color:#909399;font-size:12px;">买家信息</div>
                        <div style="font-weight:600;font-size:13px;margin-top:4px;">{{ orderTreeDialog.data.order?.buyer_nickname || '-' }}</div>
                    </el-col>
                    <el-col :span="6">
                        <div style="color:#909399;font-size:12px;">实付金额</div>
                        <div style="font-weight:600;font-size:15px;color:#e6a23c;margin-top:4px;">¥ {{ orderTreeDialog.data.order?.pay_fee || '0.00' }}</div>
                    </el-col>
                    <el-col :span="6">
                        <div style="color:#909399;font-size:12px;">状态 / 付款时间</div>
                        <div style="font-size:12px;margin-top:4px;">
                            <span class="sa-color--success">{{ orderTreeDialog.data.order?.status_text }}</span> / {{ orderTreeDialog.data.order?.paid_time }}
                        </div>
                    </el-col>
                </el-row>
                <el-divider style="margin:12px 0"></el-divider>
                <el-row :gutter="16">
                    <el-col :span="8">
                        <div style="color:#909399;font-size:12px;">本单服务收益总额</div>
                        <div style="font-weight:bold;font-size:18px;color:#f56c6c;margin-top:2px;">¥ {{ orderTreeDialog.data.summary?.total_cash || '0.00' }}</div>
                    </el-col>
                    <el-col :span="8">
                        <div style="color:#909399;font-size:12px;">综合结算拨比率</div>
                        <div style="font-weight:bold;font-size:18px;margin-top:2px;" :style="{color: parseFloat(orderTreeDialog.data.summary?.payout_ratio || 0) > 70 ? '#e6a23c' : '#67c23a'}">
                            {{ orderTreeDialog.data.summary?.payout_ratio || '0%' }}
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div style="color:#909399;font-size:12px;">贡献dmepa (1:1 GMV)</div>
                        <div style="font-weight:bold;font-size:18px;color:#409eff;margin-top:2px;">{{ orderTreeDialog.data.summary?.total_madow || '0.00000000' }}</div>
                    </el-col>
                </el-row>
                <div v-if="orderTreeDialog.data.voucher_plan" style="margin-top:12px;background:#fff;padding:8px 12px;border-radius:4px;border:1px dashed #dcdfe6;font-size:12px;color:#606266;">
                    <span style="font-weight:600;color:#303133;">1.5倍消费补贴履约计划：</span>
                    总额 {{ orderTreeDialog.data.voucher_plan.total_amount }} 个，已释放 {{ orderTreeDialog.data.voucher_plan.released_amount }} 个 (已释放 {{ orderTreeDialog.data.voucher_plan.released_days }}/365天)，状态：{{ orderTreeDialog.data.voucher_plan.status_text }}
                </div>
            </div>

            <div style="font-weight:600;margin-bottom:8px;font-size:14px;">服务收益分配明细</div>
            <el-table :data="orderTreeDialog.data.rewards || []" size="small" border stripe max-height="320">
                <el-table-column prop="role_text" label="结算身份" width="90"></el-table-column>
                <el-table-column label="受益人" min-width="130">
                    <template #default="scope">
                        <span>{{ scope.row.user_nickname }} (ID:{{ scope.row.user_id }})</span>
                    </template>
                </el-table-column>
                <el-table-column prop="reward_type_text" label="奖励类型" width="130"></el-table-column>
                <el-table-column label="结算金额" width="100">
                    <template #default="scope">
                        <span style="font-weight:600;color:#f56c6c;">¥ {{ scope.row.amount }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="入账账户" width="100">
                    <template #default="scope">
                        <el-tag
                            size="small"
                            :type="scope.row.wallet_type === 'money' ? 'success' : (scope.row.wallet_type === 'madow' ? 'primary' : 'info')"
                        >
                            {{ scope.row.wallet_type_text || '钱包余额' }}
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column prop="madow" label="dmepa (枚)" width="100"></el-table-column>
                <el-table-column prop="status_text" label="状态" width="80">
                    <template #default="scope">
                        <span :class="scope.row.status == 1 ? 'sa-color--success' : (scope.row.status == -2 ? 'sa-color--danger' : 'sa-color--info')">
                            {{ scope.row.status_text }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column prop="formula" label="测算规则/说明" min-width="180"></el-table-column>
            </el-table>
        </div>
        <template #footer>
            <el-button @click="orderTreeDialog.visible = false">关闭</el-button>
        </template>
    </el-dialog>
</div>