front / rider-admin · Files

<template>
  <div>
    <a-card title="租户管理" :bordered="false">
      <template #extra>
        <a-button type="primary" @click="openAdd">新增</a-button>
      </template>
      <a-table :dataSource="list" :columns="columns" :loading="loading" rowKey="id" :pagination="false">
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'status'">
            <a-tag :color="record.status === 1 ? 'green' : 'default'">
              {{ record.status === 1 ? '已开通' : '未开通' }}
            </a-tag>
          </template>
          <template v-if="column.key === 'action'">
            <a-space>
              <a @click="openEdit(record)">编辑</a>
              <a @click="openConfig(record)">配送费配置</a>
              <a @click="openLevelConfig(record)">骑手等级</a>
              <a-popconfirm :title="record.status === 1 ? '确认关闭？' : '确认开通？'" @confirm="toggleStatus(record)">
                <a>{{ record.status === 1 ? '关闭' : '开通' }}</a>
              </a-popconfirm>
            </a-space>
          </template>
        </template>
      </a-table>
    </a-card>

    <a-modal v-model:open="modalVisible" :title="editingId ? '编辑' : '新增租户'" @ok="handleSave" :confirmLoading="saving">
      <a-form :model="form" layout="vertical">
        <a-form-item label="名称">
          <a-input v-model:value="form.name" placeholder="如：华东一区 / 某租户名" />
        </a-form-item>
        <a-form-item label="区划码/编号（选填）">
          <a-input v-model:value="form.areaCode" placeholder="行政区划码或自定义编号" />
        </a-form-item>
        <a-form-item label="平台抽成比例（%）">
          <a-input-number v-model:value="form.rate" :min="0" :max="100" style="width:100%" />
        </a-form-item>
        <a-form-item label="排序">
          <a-input-number v-model:value="form.listOrder" :min="0" style="width:100%" />
        </a-form-item>
      </a-form>
    </a-modal>

    <a-modal v-model:open="configVisible" :title="`配送费配置 - ${currentCityName}`" width="1320px" :footer="null">
      <div class="plan-layout">
        <div class="plan-sidebar">
          <div class="plan-sidebar-header">
            <div>
              <div class="plan-sidebar-title">计价方案</div>
              <div class="plan-sidebar-subtitle">同一租户可维护多套外卖配送规则</div>
            </div>
            <a-button type="primary" size="small" @click="createPlan">新增</a-button>
          </div>
          <a-spin :spinning="planLoading">
            <div class="plan-list">
              <button
                v-for="item in planList"
                :key="item.id"
                type="button"
                class="plan-item"
                :class="{ active: item.id === selectedPlanId }"
                @click="selectPlan(item.id)"
              >
                <div class="plan-item-top">
                  <span class="plan-item-name">{{ item.name }}</span>
                  <a-tag v-if="item.isDefault === 1" color="green">默认</a-tag>
                </div>
                <div class="plan-item-bottom">
                  <span>{{ item.status === 1 ? '启用中' : '已停用' }}</span>
                  <span>排序 {{ item.listOrder ?? 0 }}</span>
                </div>
              </button>
              <a-empty v-if="!planList.length" description="暂无计价方案" />
            </div>
          </a-spin>
        </div>

        <div class="plan-content">
          <template v-if="currentPlan && config">
            <div class="plan-toolbar">
              <a-space wrap>
                <a-button @click="copyPlan" :disabled="!selectedPlanId">复制当前方案</a-button>
                <a-button @click="setDefaultPlan" :disabled="currentPlan.isDefault === 1 || currentPlan.status !== 1">设为默认</a-button>
                <a-popconfirm title="确认删除当前方案？" @confirm="deletePlan">
                  <a-button danger :disabled="currentPlan.isDefault === 1">删除方案</a-button>
                </a-popconfirm>
              </a-space>
              <a-space wrap>
                <a-button @click="previewPlan" :loading="previewing">试算配送费</a-button>
                <a-button type="primary" @click="saveCurrentPlan" :loading="planSaving">保存当前方案</a-button>
              </a-space>
            </div>

            <a-row :gutter="16">
              <a-col :span="8">
                <a-form-item label="方案名称">
                  <a-input v-model:value="currentPlan.name" placeholder="如：标准午高峰方案" />
                </a-form-item>
              </a-col>
              <a-col :span="8">
                <a-form-item label="状态">
                  <a-select v-model:value="currentPlan.status">
                    <a-select-option :value="1">启用</a-select-option>
                    <a-select-option :value="0">停用</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="8">
                <a-form-item label="排序">
                  <a-input-number v-model:value="currentPlan.listOrder" :min="0" style="width:100%" />
                </a-form-item>
              </a-col>
            </a-row>
            <a-form-item label="备注">
              <a-input v-model:value="currentPlan.remark" placeholder="可填写适用业务场景说明" />
            </a-form-item>

            <a-card class="preview-card" :bordered="false">
              <template #title>草稿试算</template>
              <a-row :gutter="12">
                <a-col :span="6">
                  <a-form-item label="起点经度">
                    <a-input v-model:value="previewForm.startLng" placeholder="121.4737" />
                  </a-form-item>
                </a-col>
                <a-col :span="6">
                  <a-form-item label="起点纬度">
                    <a-input v-model:value="previewForm.startLat" placeholder="31.2304" />
                  </a-form-item>
                </a-col>
                <a-col :span="6">
                  <a-form-item label="终点经度">
                    <a-input v-model:value="previewForm.endLng" placeholder="121.4879" />
                  </a-form-item>
                </a-col>
                <a-col :span="6">
                  <a-form-item label="终点纬度">
                    <a-input v-model:value="previewForm.endLat" placeholder="31.2492" />
                  </a-form-item>
                </a-col>
              </a-row>
              <a-row :gutter="12">
                <a-col :span="8">
                  <a-form-item label="重量（kg）">
                    <a-input-number v-model:value="previewForm.weight" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
                <a-col :span="8">
                  <a-form-item label="件数">
                    <a-input-number v-model:value="previewForm.pieces" :min="0" style="width:100%" />
                  </a-form-item>
                </a-col>
                <a-col :span="8">
                  <a-form-item label="服务时间戳（秒，可空）">
                    <a-input v-model:value="previewForm.serviceTime" placeholder="留空则按当前时间" />
                  </a-form-item>
                </a-col>
              </a-row>
              <div v-if="previewResult" class="preview-result">
                <a-tag color="processing">总配送费 {{ previewResult.totalFee ?? 0 }} 元</a-tag>
                <a-tag>基础 {{ previewResult.moneyBasic ?? 0 }}</a-tag>
                <a-tag>里程 {{ previewResult.moneyDistance ?? 0 }}</a-tag>
                <a-tag>重量 {{ previewResult.moneyWeight ?? 0 }}</a-tag>
                <a-tag>件数 {{ previewResult.moneyPiece ?? 0 }}</a-tag>
                <a-tag>时段 {{ previewResult.moneyTime ?? 0 }}</a-tag>
                <a-tag>预计送达 {{ previewResult.estimatedMinutes ?? 0 }} 分钟</a-tag>
                <a-tag>里程 {{ previewResult.distance ?? 0 }} km</a-tag>
                <a-tag v-if="previewResult.minFeeApplied === 1" color="gold">已触发保底 {{ previewResult.minFee ?? 0 }}</a-tag>
                <a-tag v-if="previewResult.moneyTime > 0" color="purple">当前服务时间命中时段加价</a-tag>
              </div>
            </a-card>

            <a-form :model="config" layout="vertical">
              <a-divider orientation="left">费用总览</a-divider>
              <a-row :gutter="16">
                <a-col :span="12">
                  <a-form-item label="保底费用（元）">
                    <a-input-number v-model:value="config.type6.minFee" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
                <a-col :span="12">
                  <a-form-item label="基础费（元/单）">
                    <a-input-number v-model:value="config.type6.baseFee" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
              </a-row>

              <a-divider orientation="left">里程阶梯</a-divider>
              <a-row :gutter="16">
                <a-col :span="12">
                  <a-form-item label="起步里程（km内）">
                    <a-input-number v-model:value="config.type6.distanceBasic" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
                <a-col :span="12">
                  <a-form-item label="起步费用（元）">
                    <a-input-number v-model:value="config.type6.distanceBasicMoney" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
              </a-row>
              <div style="margin-bottom:12px">
                <a-button type="dashed" block @click="addDistanceStep">新增阶梯段</a-button>
              </div>
              <div v-if="distanceSteps.length">
                <a-row
                  v-for="(step, index) in distanceSteps"
                  :key="index"
                  :gutter="12"
                  style="margin-bottom:12px;align-items:flex-start"
                >
                  <a-col :span="7">
                    <a-form-item :label="index === 0 ? '结束里程（km）' : ''">
                      <a-input-number v-model:value="step.endDistance" :min="0" :step="0.1" style="width:100%" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="7">
                    <a-form-item :label="index === 0 ? '每档里程（km）' : ''">
                      <a-input-number v-model:value="step.unitDistance" :min="0.1" :step="0.1" style="width:100%" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="7">
                    <a-form-item :label="index === 0 ? '每档加价（元）' : ''">
                      <a-input-number v-model:value="step.unitFee" :min="0" :step="0.1" style="width:100%" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="3">
                    <a-form-item :label="index === 0 ? '操作' : ''">
                      <a-button danger block @click="removeDistanceStep(index)">删除</a-button>
                    </a-form-item>
                  </a-col>
                </a-row>
              </div>
              <a-empty v-else description="暂无里程阶梯配置" />

              <a-divider orientation="left">重量计费</a-divider>
              <a-row :gutter="16">
                <a-col :span="12">
                  <a-form-item label="首重（kg）">
                    <a-input-number v-model:value="config.type6.weightFirst" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
                <a-col :span="12">
                  <a-form-item label="首重费用（元）">
                    <a-input-number v-model:value="config.type6.weightFirstFee" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
              </a-row>
              <a-row :gutter="16">
                <a-col :span="12">
                  <a-form-item label="续重单价（元/kg）">
                    <a-input-number v-model:value="config.type6.weightUnitFee" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
                <a-col :span="12">
                  <a-form-item label="封顶费用（元）">
                    <a-input-number v-model:value="config.type6.weightCapFee" :min="0" :step="0.1" style="width:100%" />
                  </a-form-item>
                </a-col>
              </a-row>

              <a-divider orientation="left">件数计费</a-divider>
              <div style="margin-bottom:12px">
                <a-button type="dashed" block @click="addPieceRule">新增件数区间</a-button>
              </div>
              <div v-if="pieceRules.length">
                <a-row
                  v-for="(rule, index) in pieceRules"
                  :key="index"
                  :gutter="12"
                  style="margin-bottom:12px;align-items:flex-start"
                >
                  <a-col :span="6">
                    <a-form-item :label="index === 0 ? '起始件数' : ''">
                      <a-input-number v-model:value="rule.startPiece" :min="0" style="width:100%" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="6">
                    <a-form-item :label="index === 0 ? '结束件数' : ''">
                      <a-input-number v-model:value="rule.endPiece" :min="0" style="width:100%" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="8">
                    <a-form-item :label="index === 0 ? '费用（元）' : ''">
                      <a-input-number v-model:value="rule.fee" :min="0" :step="0.1" style="width:100%" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="4">
                    <a-form-item :label="index === 0 ? '操作' : ''">
                      <a-button danger block @click="removePieceRule(index)">删除</a-button>
                    </a-form-item>
                  </a-col>
                </a-row>
              </div>
              <a-empty v-else description="暂无件数区间配置" />

              <a-divider orientation="left">时段附加费</a-divider>
              <div style="margin-bottom:12px">
                <a-button type="dashed" block @click="addTimePeriod">新增时段</a-button>
              </div>
              <div v-if="timePeriods.length">
                <a-row
                  v-for="(period, index) in timePeriods"
                  :key="index"
                  :gutter="12"
                  style="margin-bottom:12px;align-items:flex-start"
                >
                  <a-col :span="5">
                    <a-form-item :label="index === 0 ? '开始时间' : ''">
                      <a-input v-model:value="period.startText" placeholder="22:00" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="5">
                    <a-form-item :label="index === 0 ? '结束时间' : ''">
                      <a-input v-model:value="period.endText" placeholder="06:00" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="5">
                    <a-form-item :label="index === 0 ? '附加费（元）' : ''">
                      <a-input-number v-model:value="period.money" :min="0" :step="0.1" style="width:100%" />
                    </a-form-item>
                  </a-col>
                  <a-col :span="5">
                    <a-form-item :label="index === 0 ? '状态' : ''">
                      <a-select v-model:value="period.isOpen">
                        <a-select-option :value="1">启用</a-select-option>
                        <a-select-option :value="0">关闭</a-select-option>
                      </a-select>
                    </a-form-item>
                  </a-col>
                  <a-col :span="4">
                    <a-form-item :label="index === 0 ? '操作' : ''">
                      <a-button danger block @click="removeTimePeriod(index)">删除</a-button>
                    </a-form-item>
                  </a-col>
                </a-row>
              </div>
              <a-empty v-else description="暂无时段附加费配置" />

              <a-divider orientation="left">预计送达与展示</a-divider>
              <a-row :gutter="16">
                <a-col :span="12">
                  <a-form-item label="预计送达基础时间（分钟）">
                    <a-input-number v-model:value="config.distanceBasicTime" :min="0" style="width:100%" />
                  </a-form-item>
                </a-col>
                <a-col :span="12">
                  <a-form-item label="超出每km增加时间（分钟）">
                    <a-input-number v-model:value="config.distanceMoreTime" :min="0" style="width:100%" />
                  </a-form-item>
                </a-col>
              </a-row>
              <a-form-item label="附近骑手显示范围（km）">
                <a-input-number v-model:value="config.riderDistance" :min="0" :step="0.1" style="width:100%" />
              </a-form-item>
            </a-form>
          </template>
          <div v-else class="plan-empty-state">
            <a-empty description="当前租户还没有配送费方案">
              <template #extra>
                <a-space>
                  <a-button type="primary" @click="initializeDefaultPlan" :loading="planSaving">初始化默认方案</a-button>
                  <a-button @click="createPlan" :loading="planSaving">新增空白方案</a-button>
                </a-space>
              </template>
            </a-empty>
          </div>
        </div>
      </div>
    </a-modal>

    <a-modal v-model:open="levelVisible" :title="`骑手等级配置 - ${levelCityName}`" width="900px" :footer="null">
      <div style="margin-bottom:16px;text-align:right">
        <a-button type="primary" @click="openLevelAdd">新增等级</a-button>
      </div>
      <a-table :dataSource="levelList" :columns="levelColumns" :loading="levelLoading" rowKey="id" :pagination="false">
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'isDefault'">
            <a-tag :color="record.isDefault === 1 ? 'green' : 'default'">
              {{ record.isDefault === 1 ? '默认' : '普通' }}
            </a-tag>
          </template>
          <template v-if="column.key === 'runFeeMode'">
            {{ runFeeModeMap[record.runFeeMode] || '-' }}
          </template>
          <template v-if="column.key === 'rule'">
            {{ formatLevelRule(record) }}
          </template>
          <template v-if="column.key === 'action'">
            <a-space>
              <a @click="openLevelEdit(record)">编辑</a>
              <a v-if="record.isDefault !== 1" @click="handleSetDefault(record)">设为默认</a>
              <a-popconfirm title="确认删除该等级？" @confirm="handleDeleteLevel(record)">
                <a style="color:red">删除</a>
              </a-popconfirm>
            </a-space>
          </template>
        </template>
      </a-table>
    </a-modal>

    <a-modal v-model:open="levelEditVisible" :title="levelEditingId ? '编辑骑手等级' : '新增骑手等级'" @ok="handleSaveLevel" :confirmLoading="levelSaving">
      <a-form :model="levelForm" layout="vertical">
        <a-form-item label="等级编号">
          <a-input-number v-model:value="levelForm.levelId" :min="1" style="width:100%" />
        </a-form-item>
        <a-form-item label="等级名称">
          <a-input v-model:value="levelForm.name" placeholder="如：标准骑手 / 金牌骑手" />
        </a-form-item>
        <a-form-item label="每日转单上限">
          <a-input-number v-model:value="levelForm.transNums" :min="0" style="width:100%" />
        </a-form-item>
        <a-form-item label="收入模式">
          <a-radio-group v-model:value="levelForm.runFeeMode">
            <a-radio :value="1">固定金额</a-radio>
            <a-radio :value="2">按比例</a-radio>
            <a-radio :value="3">按距离</a-radio>
          </a-radio-group>
        </a-form-item>
        <template v-if="levelForm.runFeeMode === 1">
          <a-form-item label="固定收入（元）">
            <a-input-number v-model:value="levelForm.runFixMoney" :min="0" :step="0.1" style="width:100%" />
          </a-form-item>
        </template>
        <template v-else-if="levelForm.runFeeMode === 2">
          <a-form-item label="收入比例（%）">
            <a-input-number v-model:value="levelForm.runRate" :min="0" :max="100" :step="0.1" style="width:100%" />
          </a-form-item>
        </template>
        <template v-else>
          <a-row :gutter="16">
            <a-col :span="12">
              <a-form-item label="起始距离（米）">
                <a-input-number v-model:value="levelForm.distanceBasic" :min="0" style="width:100%" />
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="基础收入（元）">
                <a-input-number v-model:value="levelForm.distanceBasicMoney" :min="0" :step="0.1" style="width:100%" />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row :gutter="16">
            <a-col :span="12">
              <a-form-item label="超出每公里收入（元）">
                <a-input-number v-model:value="levelForm.distanceMoreMoney" :min="0" :step="0.1" style="width:100%" />
              </a-form-item>
            </a-col>
            <a-col :span="12">
              <a-form-item label="最高收入上限（元）">
                <a-input-number v-model:value="levelForm.distanceMaxMoney" :min="0" :step="0.1" style="width:100%" />
              </a-form-item>
            </a-col>
          </a-row>
        </template>
      </a-form>
    </a-modal>
  </div>
</template>

<script setup lang="ts">
import { onMounted, reactive, ref } from 'vue'
import { message } from 'ant-design-vue'
import { cityApi, riderLevelApi } from '@/api'

type TimePeriodForm = {
  startText: string
  endText: string
  isOpen: number
  money: number | null
}

type DistanceStepForm = {
  endDistance: number | null
  unitDistance: number | null
  unitFee: number | null
}

type PieceRuleForm = {
  startPiece: number | null
  endPiece: number | null
  fee: number | null
}

const loading = ref(false)
const saving = ref(false)
const list = ref<any[]>([])
const modalVisible = ref(false)
const configVisible = ref(false)
const levelVisible = ref(false)
const levelEditVisible = ref(false)
const editingId = ref<number | null>(null)
const currentCityId = ref<number>(0)
const currentCityName = ref('')
const levelCityId = ref<number>(0)
const levelCityName = ref('')
const form = reactive({ name: '', areaCode: '', rate: 0, listOrder: 0 })

const config = ref<any>(null)
const planList = ref<any[]>([])
const planLoading = ref(false)
const planSaving = ref(false)
const selectedPlanId = ref<number | null>(null)
const currentPlan = ref<any>(null)
const timePeriods = ref<TimePeriodForm[]>([])
const distanceSteps = ref<DistanceStepForm[]>([])
const pieceRules = ref<PieceRuleForm[]>([])
const previewing = ref(false)
const previewResult = ref<any>(null)
const previewForm = reactive({
  startLng: '',
  startLat: '',
  endLng: '',
  endLat: '',
  weight: 0,
  pieces: 1,
  serviceTime: '',
})

const levelLoading = ref(false)
const levelSaving = ref(false)
const levelList = ref<any[]>([])
const levelEditingId = ref<number | null>(null)
const levelForm = reactive({
  cityId: 0,
  levelId: 1,
  name: '',
  transNums: 0,
  runFeeMode: 1,
  runFixMoney: 0,
  runRate: 0,
  distanceBasic: 0,
  distanceBasicMoney: 0,
  distanceMoreMoney: 0,
  distanceMaxMoney: 0,
})

const columns = [
  { title: 'ID', dataIndex: 'id', key: 'id', width: 80 },
  { title: '名称', dataIndex: 'name', key: 'name' },
  { title: '区划码/编号', dataIndex: 'areaCode', key: 'areaCode' },
  { title: '抽成%', dataIndex: 'rate', key: 'rate' },
  { title: '状态', key: 'status' },
  { title: '操作', key: 'action' },
]

const levelColumns = [
  { title: '等级编号', dataIndex: 'levelId', width: 100 },
  { title: '等级名称', dataIndex: 'name' },
  { title: '默认', key: 'isDefault', width: 90 },
  { title: '转单上限', dataIndex: 'transNums', width: 100 },
  { title: '收入模式', key: 'runFeeMode', width: 110 },
  { title: '规则', key: 'rule' },
  { title: '操作', key: 'action', width: 220 },
]

const runFeeModeMap: Record<number, string> = {
  1: '固定金额',
  2: '按比例',
  3: '按距离',
}

async function loadList() {
  loading.value = true
  try {
    const res: any = await cityApi.tree()
    list.value = res.data
  } finally {
    loading.value = false
  }
}

function openAdd() {
  editingId.value = null
  Object.assign(form, { name: '', areaCode: '', rate: 0, listOrder: 0 })
  modalVisible.value = true
}

function openEdit(record: any) {
  editingId.value = record.id
  Object.assign(form, { name: record.name, areaCode: record.areaCode, rate: record.rate, listOrder: record.listOrder })
  modalVisible.value = true
}

async function handleSave() {
  saving.value = true
  try {
    if (editingId.value) {
      await cityApi.edit({ ...form, id: editingId.value })
    } else {
      await cityApi.add(form)
    }
    message.success('保存成功')
    modalVisible.value = false
    loadList()
  } finally {
    saving.value = false
  }
}

async function toggleStatus(record: any) {
  await cityApi.setStatus(record.id, record.status === 1 ? 0 : 1)
  message.success('操作成功')
  loadList()
}

async function openConfig(record: any) {
  currentCityId.value = record.id
  currentCityName.value = record.name
  configVisible.value = true
  previewResult.value = null
  Object.assign(previewForm, { startLng: '', startLat: '', endLng: '', endLat: '', weight: 0, pieces: 1, serviceTime: '' })
  await loadPlanList(record.id)
}

async function loadPlanList(cityId: number, preferPlanId?: number) {
  planLoading.value = true
  try {
    const res: any = await cityApi.listFeePlans(cityId)
    planList.value = Array.isArray(res?.data) ? res.data : []
    const targetPlanId = preferPlanId || planList.value.find(item => item.isDefault === 1)?.id || planList.value[0]?.id
    if (targetPlanId) {
      await selectPlan(targetPlanId)
    } else {
      selectedPlanId.value = null
      currentPlan.value = null
      config.value = null
    }
  } finally {
    planLoading.value = false
  }
}

async function selectPlan(planId: number) {
  selectedPlanId.value = planId
  const res: any = await cityApi.getFeePlan(currentCityId.value, planId)
  const detail = res?.data || {}
  currentPlan.value = {
    id: detail.id,
    name: detail.name || '',
    status: detail.status ?? 1,
    listOrder: detail.listOrder ?? 0,
    remark: detail.remark || '',
    isDefault: detail.isDefault ?? 0,
  }
  config.value = normalizeConfig(detail.config)
  distanceSteps.value = (config.value.type6.distanceSteps || []).map((step: any) => ({
    endDistance: step.endDistance ?? 0,
    unitDistance: step.unitDistance ?? 1,
    unitFee: step.unitFee ?? 0,
  }))
  pieceRules.value = (config.value.type6.pieceRules || []).map((rule: any) => ({
    startPiece: rule.startPiece ?? 0,
    endPiece: rule.endPiece ?? 0,
    fee: rule.fee ?? 0,
  }))
  timePeriods.value = (config.value.type6.times || []).map((period: any) => ({
    startText: minuteToText(period.start),
    endText: minuteToText(period.end),
    isOpen: period.isOpen === 0 ? 0 : 1,
    money: period.money ?? 0,
  }))
  previewResult.value = null
}

async function createPlan() {
  if (!currentCityId.value) return
  planSaving.value = true
  try {
    const payload = {
      name: `方案${planList.value.length + 1}`,
      status: 1,
      listOrder: planList.value.length,
      remark: '',
      config: deepClone(config.value || normalizeConfig(null)),
    }
    const res: any = await cityApi.createFeePlan(currentCityId.value, payload)
    message.success('方案已创建')
    await loadPlanList(currentCityId.value, res?.data)
  } catch (err: any) {
    message.error(err?.message || '方案创建失败')
  } finally {
    planSaving.value = false
  }
}

async function initializeDefaultPlan() {
  if (!currentCityId.value) return
  planSaving.value = true
  try {
    const res: any = await cityApi.initDefaultFeePlan(currentCityId.value)
    message.success('默认方案已初始化')
    await loadPlanList(currentCityId.value, res?.data)
  } catch (err: any) {
    message.error(err?.message || '默认方案初始化失败')
  } finally {
    planSaving.value = false
  }
}

async function copyPlan() {
  if (!selectedPlanId.value) return
  const res: any = await cityApi.copyFeePlan(currentCityId.value, selectedPlanId.value)
  message.success('方案已复制')
  await loadPlanList(currentCityId.value, res?.data)
}

async function deletePlan() {
  if (!selectedPlanId.value) return
  await cityApi.deleteFeePlan(currentCityId.value, selectedPlanId.value)
  message.success('方案已删除')
  await loadPlanList(currentCityId.value)
}

async function setDefaultPlan() {
  if (!selectedPlanId.value) return
  if (currentPlan.value?.status !== 1) {
    message.error('请先启用当前方案，再设为默认')
    return
  }
  await cityApi.setDefaultFeePlan(currentCityId.value, selectedPlanId.value)
  message.success('默认方案已更新')
  await loadPlanList(currentCityId.value, selectedPlanId.value)
}

async function saveCurrentPlan() {
  if (!selectedPlanId.value || !currentPlan.value) return
  try {
    const payload = buildPlanPayload()
    planSaving.value = true
    await cityApi.updateFeePlan(currentCityId.value, selectedPlanId.value, payload)
    message.success('方案保存成功')
    await loadPlanList(currentCityId.value, selectedPlanId.value)
  } catch (err: any) {
    message.error(err?.message || '方案保存失败')
  } finally {
    planSaving.value = false
  }
}

async function previewPlan() {
  try {
    const payload = buildPlanPayload()
    if (!previewForm.startLng || !previewForm.startLat || !previewForm.endLng || !previewForm.endLat) {
      message.error('请填写完整的试算经纬度')
      return
    }
    previewing.value = true
    const res: any = await cityApi.previewFeePlan(currentCityId.value, {
      config: payload.config,
      calc: {
        startLng: previewForm.startLng,
        startLat: previewForm.startLat,
        endLng: previewForm.endLng,
        endLat: previewForm.endLat,
        weight: previewForm.weight ?? 0,
        pieces: previewForm.pieces ?? 0,
        serviceTime: previewForm.serviceTime ? Number(previewForm.serviceTime) : 0,
      },
    })
    previewResult.value = res?.data || null
  } catch (err: any) {
    message.error(err?.message || '试算失败')
  } finally {
    previewing.value = false
  }
}

function buildPlanPayload() {
  if (!currentPlan.value) {
    throw new Error('请选择计价方案')
  }
  const planName = String(currentPlan.value.name || '').trim()
  if (!planName) {
    throw new Error('请填写方案名称')
  }
  const nextConfig = deepClone(config.value || normalizeConfig(null))
  nextConfig.type = [6]
  nextConfig.type6.baseSwitch = nextConfig.type6.baseFee > 0 ? 1 : 0
  nextConfig.type6.distanceSwitch = 1
  nextConfig.type6.weightSwitch =
    nextConfig.type6.weightFirst > 0 || nextConfig.type6.weightFirstFee > 0 || nextConfig.type6.weightUnitFee > 0 ? 1 : 0
  nextConfig.type6.pieceSwitch = pieceRules.value.length ? 1 : 0
  nextConfig.type6.distanceSteps = buildDistanceStepsPayload()
  nextConfig.type6.pieceRules = buildPieceRulesPayload()
  nextConfig.type6.times = buildTimesPayload()
  return {
    name: planName,
    status: currentPlan.value.status ?? 1,
    listOrder: currentPlan.value.listOrder ?? 0,
    remark: currentPlan.value.remark || '',
    config: nextConfig,
  }
}

function openLevelConfig(record: any) {
  levelCityId.value = record.id
  levelCityName.value = record.name
  levelVisible.value = true
  loadLevels()
}

async function loadLevels() {
  levelLoading.value = true
  try {
    const res: any = await riderLevelApi.list(levelCityId.value)
    levelList.value = Array.isArray(res?.data) ? res.data : []
  } finally {
    levelLoading.value = false
  }
}

function openLevelAdd() {
  levelEditingId.value = null
  Object.assign(levelForm, {
    cityId: levelCityId.value,
    levelId: (levelList.value[levelList.value.length - 1]?.levelId || 0) + 1,
    name: '',
    transNums: 0,
    runFeeMode: 1,
    runFixMoney: 0,
    runRate: 0,
    distanceBasic: 0,
    distanceBasicMoney: 0,
    distanceMoreMoney: 0,
    distanceMaxMoney: 0,
  })
  levelEditVisible.value = true
}

function openLevelEdit(record: any) {
  levelEditingId.value = record.id
  Object.assign(levelForm, {
    cityId: levelCityId.value,
    levelId: record.levelId,
    name: record.name,
    transNums: record.transNums,
    runFeeMode: record.runFeeMode,
    runFixMoney: record.runFixMoney ?? 0,
    runRate: record.runRate ?? 0,
    distanceBasic: record.distanceBasic ?? 0,
    distanceBasicMoney: record.distanceBasicMoney ?? 0,
    distanceMoreMoney: record.distanceMoreMoney ?? 0,
    distanceMaxMoney: record.distanceMaxMoney ?? 0,
  })
  levelEditVisible.value = true
}

async function handleSaveLevel() {
  if (!levelForm.name) {
    message.error('请填写等级名称')
    return
  }
  levelSaving.value = true
  try {
    const payload = { ...levelForm, id: levelEditingId.value || undefined }
    if (levelEditingId.value) {
      await riderLevelApi.edit(payload)
    } else {
      await riderLevelApi.add(payload)
    }
    message.success('保存成功')
    levelEditVisible.value = false
    loadLevels()
  } finally {
    levelSaving.value = false
  }
}

async function handleSetDefault(record: any) {
  await riderLevelApi.setDefault(record.id, levelCityId.value)
  message.success('设置成功')
  loadLevels()
}

async function handleDeleteLevel(record: any) {
  await riderLevelApi.del(record.id, levelCityId.value)
  message.success('删除成功')
  loadLevels()
}

function formatLevelRule(record: any) {
  if (record.runFeeMode === 1) {
    return `固定 ${record.runFixMoney ?? 0} 元`
  }
  if (record.runFeeMode === 2) {
    return `按配送费 ${record.runRate ?? 0}%`
  }
  return `起始${record.distanceBasic ?? 0}米/${record.distanceBasicMoney ?? 0}元，超出每公里${record.distanceMoreMoney ?? 0}元，上限${record.distanceMaxMoney ?? 0}元`
}

function createDefaultType6() {
  return {
    minFee: 0,
    baseSwitch: 0,
    baseFee: 0,
    feeMode: 2,
    fixMoney: 0,
    distanceSwitch: 1,
    distanceBasic: 3,
    distanceBasicMoney: 4,
    distanceMoreMoney: 1.5,
    distanceType: 1,
    distanceSteps: [],
    weightSwitch: 1,
    weightFirst: 5,
    weightFirstFee: 0,
    weightUnitFee: 1,
    weightCapFee: 30,
    weightBasic: 0,
    weightBasicMoney: 0,
    weightMoreMoney: 0,
    weightType: 1,
    pieceSwitch: 0,
    pieceRules: [],
    times: [],
  }
}

function normalizeConfig(raw: any) {
  const next = raw || {}
  const type6 = { ...createDefaultType6(), ...(next.type6 || {}) }
  return {
    ...next,
    type: [6],
    type6: {
      ...type6,
      distanceSteps: Array.isArray(type6.distanceSteps) ? type6.distanceSteps : [],
      pieceRules: Array.isArray(type6.pieceRules) ? type6.pieceRules : [],
      times: Array.isArray(type6.times) ? type6.times : [],
    },
    distanceBasic: next.distanceBasic ?? 3,
    distanceBasicTime: next.distanceBasicTime ?? 30,
    distanceMoreTime: next.distanceMoreTime ?? 10,
    riderDistance: next.riderDistance ?? 3,
  }
}

function addTimePeriod() {
  timePeriods.value.push({ startText: '', endText: '', isOpen: 1, money: 0 })
}

function removeTimePeriod(index: number) {
  timePeriods.value.splice(index, 1)
}

function addDistanceStep() {
  distanceSteps.value.push({ endDistance: 0, unitDistance: 1, unitFee: 0 })
}

function removeDistanceStep(index: number) {
  distanceSteps.value.splice(index, 1)
}

function addPieceRule() {
  pieceRules.value.push({ startPiece: 0, endPiece: 0, fee: 0 })
}

function removePieceRule(index: number) {
  pieceRules.value.splice(index, 1)
}

function buildDistanceStepsPayload() {
  let prevEnd = config.value.type6.distanceBasic ?? 0
  return distanceSteps.value.map((step, index) => {
    const endDistance = step.endDistance ?? 0
    const unitDistance = step.unitDistance ?? 0
    const unitFee = step.unitFee ?? 0
    if (endDistance <= prevEnd) {
      throw new Error(`第${index + 1}条里程阶梯结束里程必须大于上一阶梯`)
    }
    if (unitDistance <= 0) {
      throw new Error(`第${index + 1}条里程阶梯每档里程必须大于0`)
    }
    prevEnd = endDistance
    return { endDistance, unitDistance, unitFee, listOrder: index }
  })
}

function buildPieceRulesPayload() {
  const payload = pieceRules.value
    .map((rule, index) => {
      const startPiece = rule.startPiece ?? 0
      const endPiece = rule.endPiece ?? 0
      if (startPiece > endPiece) {
        throw new Error(`第${index + 1}条件数区间起始值不能大于结束值`)
      }
      return { startPiece, endPiece, fee: rule.fee ?? 0, listOrder: index }
    })
    .sort((a, b) => a.startPiece - b.startPiece)

  for (let index = 1; index < payload.length; index += 1) {
    if (payload[index].startPiece <= payload[index - 1].endPiece) {
      throw new Error('件数区间不能重叠')
    }
  }
  return payload
}

function buildTimesPayload() {
  return timePeriods.value
    .map((period, index) => {
      const hasContent = period.startText || period.endText || period.money
      if (!hasContent) return null
      const start = textToMinute(period.startText, `第${index + 1}条时段开始时间格式错误`)
      const end = textToMinute(period.endText, `第${index + 1}条时段结束时间格式错误`)
      if (start === end) {
        throw new Error(`第${index + 1}条时段开始时间不能等于结束时间`)
      }
      return {
        start,
        end,
        isOpen: period.isOpen === 0 ? 0 : 1,
        money: period.money ?? 0,
      }
    })
    .filter(Boolean)
}

function textToMinute(text: string, errorMessage: string) {
  const match = /^([01]\d|2[0-3]):([0-5]\d)$/.exec((text || '').trim())
  if (!match) {
    throw new Error(errorMessage)
  }
  return Number(match[1]) * 60 + Number(match[2])
}

function minuteToText(value: number | null | undefined) {
  if (typeof value !== 'number' || Number.isNaN(value)) return ''
  const hour = Math.floor(value / 60)
  const minute = value % 60
  return `${String(hour).padStart(2, '0')}:${String(minute).padStart(2, '0')}`
}

function deepClone<T>(value: T): T {
  return JSON.parse(JSON.stringify(value))
}

onMounted(loadList)
</script>

<style scoped>
.plan-layout {
  display: flex;
  gap: 20px;
  min-height: 720px;
}

.plan-sidebar {
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  background: #f7f8fc;
  padding: 16px;
}

.plan-sidebar-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.plan-sidebar-title {
  font-size: 16px;
  font-weight: 600;
  color: #1f2430;
}

.plan-sidebar-subtitle {
  margin-top: 4px;
  font-size: 12px;
  color: #7a8091;
  line-height: 1.5;
}

.plan-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 640px;
  overflow-y: auto;
  padding-right: 4px;
}

.plan-item {
  width: 100%;
  border: 0;
  border-radius: 14px;
  background: #fff;
  padding: 14px;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(31, 36, 48, 0.06);
  transition: all 0.2s ease;
}

.plan-item.active {
  background: #eef2ff;
  box-shadow: 0 10px 24px rgba(99, 102, 241, 0.18);
}

.plan-item-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.plan-item-name {
  font-size: 14px;
  font-weight: 600;
  color: #1f2430;
}

.plan-item-bottom {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #7a8091;
}

.plan-content {
  flex: 1;
  min-width: 0;
  max-height: 720px;
  overflow-y: auto;
  padding-right: 4px;
}

.plan-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.preview-card {
  margin-bottom: 20px;
  border-radius: 16px;
  background: #fafbff;
}

.preview-result {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.plan-empty-state {
  min-height: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>