<!-- SPEC: MDTODO 三栏任务工作区. -->
<!-- Implementation reference: MDTODO R2 / PJ2026-010405 云端控制台. -->
<script setup lang="ts">
import type { ProjectSourceInput } from "@/api";
import BaseDialog from "@/components/common/BaseDialog.vue";
defineProps<{
  show: boolean;
  form: ProjectSourceInput;
  saving: boolean;
  probeLoading: boolean;
  reindexLoading: boolean;
  reindexDisabled: boolean;
  message: string | null;
  error: string | null;
}>();
const emit = defineEmits<{ close: []; save: []; probe: []; reindex: [] }>();
</script>
<template>
  <BaseDialog
    :open="show"
    title="MDTODO Source"
    description="HWPOD workspace 是 Source authority；Probe 与 Reindex 不读取或显示 Secret 值。"
    wide
    :busy="saving"
    @close="emit('close')"
  >
    <form
      id="mdtodo-source-form"
      class="source-grid"
      data-testid="mdtodo-source-config-dialog"
      @submit.prevent="emit('save')"
    >
      <label
        >Source ID<input
          v-model="form.sourceId"
          data-testid="mdtodo-source-form-id"
          required
      /></label>
      <label
        >显示名称<input
          v-model="form.displayName"
          data-testid="mdtodo-source-form-name"
          required
      /></label>
      <label
        >HWPOD ID<input
          v-model="form.hwpodId"
          data-testid="mdtodo-source-form-hwpod"
          required
      /></label>
      <label
        >Node ID<input
          v-model="form.nodeId"
          data-testid="mdtodo-source-form-node"
          required
      /></label>
      <label class="wide"
        >Workspace Root<input
          v-model="form.workspaceRootRef"
          data-testid="mdtodo-source-form-workspace"
      /></label>
      <label class="wide"
        >MDTODO Root<input
          v-model="form.mdtodoRootRef"
          data-testid="mdtodo-source-form-root"
          required
      /></label>
      <label
        >Max Files<input
          v-model.number="form.maxFiles"
          data-testid="mdtodo-source-form-max-files"
          type="number"
          min="1"
          max="500"
      /></label>
      <output
        v-if="message || error"
        class="source-output"
        data-testid="mdtodo-source-message"
        :data-error="Boolean(error)"
        >{{ error || message }}</output
      >
      <p v-if="reindexDisabled" class="source-hint">
        先保存 Source，再执行 Reindex。
      </p>
    </form>
    <template #footer>
      <button
        type="button"
        data-testid="mdtodo-source-config-close"
        :disabled="saving"
        @click="emit('close')"
      >
        取消
      </button>
      <button
        type="button"
        data-testid="mdtodo-source-probe"
        :disabled="probeLoading || saving"
        @click="emit('probe')"
      >
        {{ probeLoading ? "Probe…" : "Probe" }}
      </button>
      <button
        type="button"
        data-testid="mdtodo-source-reindex-dialog"
        :disabled="reindexLoading || saving || reindexDisabled"
        @click="emit('reindex')"
      >
        {{ reindexLoading ? "Reindex…" : "Reindex" }}
      </button>
      <button
        type="submit"
        form="mdtodo-source-form"
        data-testid="mdtodo-source-save"
        :disabled="saving"
      >
        {{ saving ? "保存中…" : "保存 Source" }}
      </button>
    </template>
  </BaseDialog>
</template>
<style scoped>
.source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
}
.source-grid label {
  display: grid;
  gap: 5px;
  color: #3a535e;
  font-size: 11px;
  font-weight: 780;
  text-transform: uppercase;
  letter-spacing: 0;
}
.source-grid label.wide,
.source-output {
  grid-column: 1 / -1;
}
.source-grid input {
  box-sizing: border-box;
  width: 100%;
  height: 34px;
  border: 1px solid #9fb3bc;
  background: #f9fbfc;
  padding: 0 8px;
  color: #172d36;
  text-transform: none;
  letter-spacing: 0;
}
.source-output {
  border: 1px solid #b6d5c0;
  background: #eef8f1;
  padding: 8px;
  color: #286344;
  font-size: 12px;
}
.source-output[data-error="true"] {
  border-color: #e1b1a9;
  background: #fff1ef;
  color: #943e31;
}
.source-hint {
  grid-column: 1 / -1;
  margin: 0;
  color: #7b5a2e;
  font-size: 11px;
}
@media (max-width: 560px) {
  .source-grid {
    grid-template-columns: 1fr;
  }
  .source-grid label.wide,
  .source-output {
    grid-column: auto;
  }
}
</style>
