<template>
  <div class="implement-page">
    <div class="implement-form">
      <el-form-item label="实施采购方式" required>
        <el-radio-group v-model="implementType">
          <el-radio label="1">自行组织采购</el-radio>
          <el-radio label="2">委托代理采购</el-radio>
        </el-radio-group>
      </el-form-item>

      <!-- 采购文件版本列表：保留原文件，多版本分别显示 -->
      <el-divider content-position="left">采购文件版本</el-divider>
      <div v-if="purchaseFileVersions.length" class="file-versions mb-2">
        <el-table :data="purchaseFileVersions" border size="small" max-height="280">
          <el-table-column type="index" label="版本" width="70" align="center">
            <template #default="{ $index }">V{{ $index + 1 }}</template>
          </el-table-column>
          <el-table-column prop="fileTitle" label="文件名" min-width="180" show-overflow-tooltip />
          <el-table-column prop="createBy" label="上传人" width="100" align="center" show-overflow-tooltip />
          <el-table-column prop="createTime" label="上传时间" width="165" align="center">
            <template #default="{ row }">{{ formatCreateTime(row.createTime) }}</template>
          </el-table-column>
          <el-table-column label="操作" width="90" align="center" fixed="right">
            <template #default="{ row }">
              <el-button type="primary" link size="small" @click="handleDownloadVersion(row)">下载</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div class="mb-2">不满意可继续上传新版本（保留原文件，格式 doc/docx/pdf，单文件不超过 5MB）：</div>
      <upload-file
        v-model="implementFileIds"
        :limit="5"
        :file-type="['doc', 'docx', 'pdf']"
        :data="{ fileType: PURCHASE_FILE_TYPE }"
        upload-file-url="/purchase/purchasingfiles/upload"
      />

      <el-divider content-position="left">发起采购文件审批</el-divider>
   

        <div class="mb-2">需求部门初审需指定采购代表人，请选择一种方式：</div>
        <el-radio-group v-model="representorMode" class="mb-2">
          <el-radio label="single">指定采购代表人（单人）</el-radio>
          <el-radio label="multi">部门多人由系统自动抽取</el-radio>
        </el-radio-group>
        <el-form-item v-if="representorMode === 'single'" label="采购代表人">
          <el-select v-model="representorTeacherNo" placeholder="请选择" clearable filterable style="width: 100%">
            <el-option v-for="m in deptMembers" :key="m.userId || m.teacherNo || m.id" :label="m.realName || m.name || m.teacherNo" :value="m.userId || m.teacherNo || m.id" />
          </el-select>
        </el-form-item>
        <el-form-item v-else label="部门多人">
          <el-select v-model="representorsMulti" placeholder="请选择多人，系统将自动抽取一人" clearable filterable multiple style="width: 100%">
            <el-option v-for="m in deptMembers" :key="m.userId || m.teacherNo || m.id" :label="m.realName || m.name || m.teacherNo" :value="m.userId || m.teacherNo || m.id" />
          </el-select>
        </el-form-item>
    
    </div>
    <div class="implement-footer">
      <el-button @click="handleClose">取消</el-button>
      <template v-if="implementHasPurchaseFiles && !applyRow?.fileFlowInstId">
        <el-button type="primary" :loading="implementSubmitting" @click="handleImplementSubmit">保存实施采购</el-button>
        <el-button type="success" :loading="startFileFlowSubmitting" @click="handleStartFileFlow">发起采购文件审批</el-button>
      </template>
      <template v-else>
        <el-button type="primary" :loading="implementSubmitting" @click="handleImplementSubmit">确定</el-button>
      </template>
    </div>
  </div>
</template>

<script setup lang="ts" name="PurchasingImplement">
import { ref, computed, onMounted, watch } from 'vue'
import { useRoute } from 'vue-router'
import { implementApply, getApplyFiles, startFileFlow, getDeptMembers, getObj } from '/@/api/finance/purchasingrequisition'
import { useMessage } from '/@/hooks/message'
import other from '/@/utils/other'
import UploadFile from '/@/components/Upload/index.vue'

// 与编辑界面一致：支持流程 dynamic-link 传入 currJob/currElTab，申请单 ID 优先取 currJob.orderId
const props = defineProps({
  currJob: { type: Object, default: null },
  currElTab: { type: Object, default: null }
})

const route = useRoute()
const PURCHASE_FILE_TYPE = '130'

/** 申请单 ID（数值，用于 getObj 等）：与 add 一致，优先流程 currJob.orderId，否则 route.query.id */
const applyId = computed(() => {
  const raw = applyIdRaw.value
  if (raw == null || raw === '') return null
  const n = Number(raw)
  return Number.isNaN(n) ? null : n
})

/** 申请单 ID 原始字符串（用于 getApplyFiles 的 purchaseId，与编辑页一致，避免类型/精度问题） */
const applyIdRaw = computed(() => {
  if (props.currJob?.orderId != null && props.currJob?.orderId !== '') {
    return String(props.currJob.orderId)
  }
  const id = route.query.id
  return id != null && id !== '' ? String(id) : ''
})

const applyRow = ref<any>(null)
/** 已有采购文件版本列表（按 createTime 排序，用于展示与提交时一并关联） */
const purchaseFileVersions = ref<{ id: string; fileTitle?: string; createBy?: string; createTime?: string; remark?: string }[]>([])
/** 本次新上传的采购文件（仅新版本，不与已有版本混在一起） */
const implementFileIds = ref<string | string[]>([])
const implementType = ref<string>('1')
const implementSubmitting = ref(false)

const representorMode = ref<'single' | 'multi'>('single')
const representorTeacherNo = ref<string>('')
const representorsMulti = ref<string[]>([])
const deptMembers = ref<any[]>([])
const startFileFlowSubmitting = ref(false)

const implementHasPurchaseFiles = computed(() => {
  if (purchaseFileVersions.value.length > 0) return true
  const raw = implementFileIds.value
  if (Array.isArray(raw)) return raw.length > 0
  return !!raw
})

function formatCreateTime(t?: string) {
  if (!t) return '-'
  const d = new Date(t)
  return isNaN(d.getTime()) ? t : d.toLocaleString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' })
}

function handleDownloadVersion(file: { remark?: string; fileTitle?: string }) {
  if (!file?.remark) {
    useMessage().warning('无法获取文件路径')
    return
  }
  const url = `/purchase/purchasingfiles/download?fileName=${encodeURIComponent(file.remark)}&fileTitle=${encodeURIComponent(file.fileTitle || '采购文件')}`
  other.downBlobFile(url, {}, file.fileTitle || '采购文件')
}

const isInIframe = () => typeof window !== 'undefined' && window.self !== window.top

const postMessage = (type: string, payload?: any) => {
  if (typeof window !== 'undefined' && window.parent) {
    window.parent.postMessage({ type, ...payload }, '*')
  }
}

const loadData = async () => {
  const id = applyId.value
  if (!id) {
    useMessage().warning('缺少申请单ID')
    return
  }
  try {
    const idStr = applyIdRaw.value || String(id)
    const [detailRes, filesRes, membersRes] = await Promise.all([
      getObj(id),
      getApplyFiles(idStr),
      getDeptMembers()
    ])
    applyRow.value = detailRes?.data ? { ...detailRes.data, id: detailRes.data.id ?? id } : { id }
    const row = applyRow.value
    if (row?.implementType) implementType.value = row.implementType
    // 回显需求部门初审-采购代表人方式与人员（与发起采购文件审批时保存的一致）
    if (row?.representorTeacherNo) {
      representorMode.value = 'single'
      representorTeacherNo.value = row.representorTeacherNo ?? ''
      representorsMulti.value = []
    } else if (row?.representors) {
      representorMode.value = 'multi'
      representorTeacherNo.value = ''
      const parts = typeof row.representors === 'string' ? row.representors.split(',') : []
      representorsMulti.value = parts.map((s: string) => s.trim()).filter(Boolean)
    } else {
      representorTeacherNo.value = ''
      representorsMulti.value = []
    }
    const list = filesRes?.data || []
    const purchaseFiles = list.filter((f: any) => f.fileType === PURCHASE_FILE_TYPE)
    purchaseFileVersions.value = purchaseFiles.map((f: any) => ({
      id: String(f.id),
      fileTitle: f.fileTitle || f.file_title || '采购文件',
      createBy: f.createBy ?? f.create_by ?? '-',
      createTime: f.createTime || f.create_time,
      remark: f.remark
    }))
    deptMembers.value = membersRes?.data || []
  } catch (_) {
    applyRow.value = { id }
    purchaseFileVersions.value = []
    deptMembers.value = []
  }
}

const handleClose = () => {
  postMessage('purchasingimplement:close')
  if (!isInIframe()) {
    window.history.back()
  }
}

const handleImplementSubmit = async () => {
  const row = applyRow.value
  if (!row?.id && !applyId.value) return
  const id = row?.id ?? applyId.value
  if (!id) return
  if (!implementType.value) {
    useMessage().warning('请选择实施采购方式')
    return
  }
  const existingIds = purchaseFileVersions.value.map((f) => f.id)
  const raw = implementFileIds.value
  const newIds: string[] = Array.isArray(raw)
    ? raw.map((x: any) => (typeof x === 'object' && x?.id ? x.id : x)).filter(Boolean)
    : raw ? [String(raw)] : []
  const fileIds = [...existingIds, ...newIds]
  if (fileIds.length === 0) {
    useMessage().warning('请至少上传一个采购文件')
    return
  }
  const single = representorMode.value === 'single' ? representorTeacherNo.value : undefined
  const multi = representorMode.value === 'multi' && representorsMulti.value?.length ? representorsMulti.value.join(',') : undefined
  implementSubmitting.value = true
  try {
    await implementApply(id, fileIds, implementType.value, single, multi)
    useMessage().success('实施采购已保存')
    implementFileIds.value = []
    await loadData()
    postMessage('purchasingimplement:saved')
  } catch (err: any) {
    useMessage().error(err?.msg || '实施采购失败')
  } finally {
    implementSubmitting.value = false
  }
}

const handleStartFileFlow = async () => {
  const row = applyRow.value
  const id = row?.id ?? applyId.value
  if (!id) return
  if (representorMode.value === 'single') {
    if (!representorTeacherNo.value) {
      useMessage().warning('请选择采购代表人')
      return
    }
  } else {
    if (!representorsMulti.value?.length) {
      useMessage().warning('请选择部门多人')
      return
    }
  }
  startFileFlowSubmitting.value = true
  try {
    const single = representorMode.value === 'single' ? representorTeacherNo.value : undefined
    const multi = representorMode.value === 'multi' ? representorsMulti.value.join(',') : undefined
    await startFileFlow(id, single, multi)
    useMessage().success('已发起采购文件审批流程')
    postMessage('purchasingimplement:submitSuccess')
    await loadData()
  } catch (err: any) {
    useMessage().error(err?.msg || '发起失败')
  } finally {
    startFileFlowSubmitting.value = false
  }
}

// 流程切换工单时重新加载数据（与 add 编辑页一致）
watch(
  () => props.currJob?.orderId ?? props.currJob?.id,
  (newVal, oldVal) => {
    if (newVal !== oldVal && applyId.value) {
      loadData()
    }
  }
)

onMounted(() => {
  loadData()
  if (isInIframe()) {
    document.documentElement.classList.add('iframe-mode')
    document.body.classList.add('iframe-mode')
  }
})
</script>

<style scoped lang="scss">
.implement-page {
  padding: 20px;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.implement-form {
  flex: 1;
  .mb-2 {
    margin-bottom: 8px;
  }
}
.implement-form-tip {
  margin-top: 12px;
  padding: 8px 0;
}
.implement-footer {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--el-border-color-lighter);
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
</style>
