优化发布页默认输入与在线时间校验

frontend/src/features/seller/composables/usePublishDraft.ts

@@ -92,6 +92,9 @@ function normalizeDraftForm(value: unknown): PublishForm {
   if (!next.accelerated_sale_ratio || next.accelerated_sale_ratio === 0) {
     next.accelerated_sale_ratio = ''
   }
+  if (next.haf_coin_amount === 0) next.haf_coin_amount = ''
+  if (String(next.secret_kd).trim() === '0') next.secret_kd = ''
+  if (next.fire_level === 0) next.fire_level = ''
   return next
 }
 

frontend/src/features/seller/composables/usePublishForm.ts

@@ -79,6 +79,12 @@ export function usePublishForm(options: UsePublishFormOptions) {
   const canPublishAfterAgreements = computed(
     () => virtualAssetSaleAgreementChecked.value && sellerAgreementChecked.value
   )
+  const disabledOnlineStartOptions = computed(() =>
+    commonOnlineTimes.filter(time => !canUseOnlineStart(time))
+  )
+  const disabledOnlineEndOptions = computed(() =>
+    commonOnlineTimes.filter(time => !canUseOnlineEnd(time))
+  )
 
   onMounted(() => {
     restoreDraft()
@@ -240,6 +246,103 @@ export function usePublishForm(options: UsePublishFormOptions) {
     }
   }
 
+  function isAllDayOnline() {
+    return form.online_start === '00:00' && form.online_end === '23:59'
+  }
+
+  function isOnlineStartPresetActive(value: string) {
+    return !isAllDayOnline() && form.online_start === value
+  }
+
+  function isOnlineEndPresetActive(value: string) {
+    return !isAllDayOnline() && form.online_end === value
+  }
+
+  function selectAllDayOnline() {
+    form.online_start = '00:00'
+    form.online_end = '23:59'
+  }
+
+  function selectOnlineStart(value: string | number) {
+    const time = String(value)
+    if (!canUseOnlineStart(time)) {
+      options.notifyWarning('开始时间必须早于结束时间')
+      return
+    }
+    form.online_start = time
+  }
+
+  function selectOnlineEnd(value: string | number) {
+    const time = String(value)
+    if (!canUseOnlineEnd(time)) {
+      options.notifyWarning('结束时间必须晚于开始时间')
+      return
+    }
+    form.online_end = time
+  }
+
+  function handleOnlineStartChange(value: string | number | null | undefined) {
+    const time = normalizeOnlineTimeValue(value)
+    form.online_start = time
+    const start = parseOnlineTime(time)
+    if (start === null) return
+    const lastTime = parseOnlineTime('23:59')
+    if (lastTime !== null && start >= lastTime) {
+      form.online_start = ''
+      options.notifyWarning('开始时间必须早于结束时间')
+      return
+    }
+    const end = parseOnlineTime(form.online_end)
+    if (end !== null && start >= end) {
+      form.online_end = ''
+      options.notifyWarning('结束时间已清空，请选择晚于开始时间的结束时间')
+    }
+  }
+
+  function handleOnlineEndChange(value: string | number | null | undefined) {
+    const time = normalizeOnlineTimeValue(value)
+    form.online_end = time
+    const end = parseOnlineTime(time)
+    if (end === null) return
+    const firstTime = parseOnlineTime('00:00')
+    if (firstTime !== null && end <= firstTime) {
+      form.online_end = ''
+      options.notifyWarning('结束时间必须晚于开始时间')
+      return
+    }
+    const start = parseOnlineTime(form.online_start)
+    if (start !== null && end <= start) {
+      form.online_end = ''
+      options.notifyWarning('结束时间必须晚于开始时间')
+    }
+  }
+
+  function canUseOnlineStart(value: string) {
+    const start = parseOnlineTime(value)
+    const lastTime = parseOnlineTime('23:59')
+    if (start === null || lastTime === null || start >= lastTime) return false
+    const end = parseOnlineTime(form.online_end)
+    return end === null || start < end
+  }
+
+  function canUseOnlineEnd(value: string) {
+    const end = parseOnlineTime(value)
+    const firstTime = parseOnlineTime('00:00')
+    if (end === null || firstTime === null || end <= firstTime) return false
+    const start = parseOnlineTime(form.online_start)
+    return start === null || end > start
+  }
+
+  function validateOnlineTime() {
+    const start = parseOnlineTime(form.online_start)
+    const end = parseOnlineTime(form.online_end)
+    if (start === null) return '请选择在线开始时间'
+    if (end === null) return '请选择在线结束时间'
+    if (start === end) return '在线开始和结束时间不能相同'
+    if (end < start) return '在线结束时间必须晚于开始时间'
+    return ''
+  }
+
   async function handleResetDraft() {
     try {
       await options.confirmReset?.()
@@ -496,6 +599,8 @@ export function usePublishForm(options: UsePublishFormOptions) {
     if (!form.stamina_level) return '请选择体力等级'
     if (!form.load_level) return '请选择负重等级'
     if (!dailyLossOptions.includes(pricing.dailyLossMAmount.value)) return '请选择每日损耗'
+    const onlineTimeError = validateOnlineTime()
+    if (onlineTimeError) return onlineTimeError
     if (pricing.hasAcceleratedSaleRatioInput()) {
       const ratio = Number(form.accelerated_sale_ratio)
       if (!Number.isFinite(ratio) || ratio <= 0) return '加速出售比例格式不正确'
@@ -669,11 +774,21 @@ export function usePublishForm(options: UsePublishFormOptions) {
     selectedSkins,
     uploadedScreenshotCount,
     requiredScreenshotCount,
+    disabledOnlineStartOptions,
+    disabledOnlineEndOptions,
     loadPublishOptions,
     saveDraft,
     handleSaveDraft,
     resetDraftState,
     handleResetDraft,
+    isAllDayOnline,
+    isOnlineStartPresetActive,
+    isOnlineEndPresetActive,
+    selectAllDayOnline,
+    selectOnlineStart,
+    selectOnlineEnd,
+    handleOnlineStartChange,
+    handleOnlineEndChange,
     toggleSkin,
     toggleRegion,
     triggerUpload,
@@ -710,3 +825,17 @@ function readError(error: unknown, fallback: string) {
   }
   return fallback
 }
+
+function parseOnlineTime(value: string) {
+  const match = /^(\d{2}):(\d{2})$/.exec(value)
+  if (!match) return null
+  const hour = Number(match[1])
+  const minute = Number(match[2])
+  if (hour < 0 || hour > 23 || minute < 0 || minute > 59) return null
+  return hour * 60 + minute
+}
+
+function normalizeOnlineTimeValue(value: string | number | null | undefined) {
+  if (value === null || value === undefined) return ''
+  return String(value)
+}

frontend/src/features/seller/views/MobileSellerListingCreateView.css

@@ -210,6 +210,14 @@
   color: #fff;
 }
 
+.radio-btn.disabled,
+.radio-btn:disabled {
+  border-color: #e5e7eb;
+  background: #f3f4f6;
+  color: #a8b0bd;
+  cursor: not-allowed;
+}
+
 .time-row,
 .result-grid {
   display: grid;

frontend/src/features/seller/views/MobileSellerListingCreateView.vue

@@ -23,6 +23,8 @@ const {
   quantityValues,
   quantityModes,
   selectedSkins,
+  disabledOnlineStartOptions,
+  disabledOnlineEndOptions,
   serverOptions,
   faceOptions,
   rankOptions,
@@ -61,6 +63,14 @@ const {
   isMultiScreenshotSlot,
   canAddScreenshot,
   getScreenshotLimitHint,
+  isAllDayOnline,
+  isOnlineStartPresetActive,
+  isOnlineEndPresetActive,
+  selectAllDayOnline,
+  selectOnlineStart,
+  selectOnlineEnd,
+  handleOnlineStartChange,
+  handleOnlineEndChange,
   handleFireLevelInput,
   handleAcceleratedSaleRatioInput,
   useRecommendedDeposit,
@@ -100,31 +110,6 @@ function openPublishAgreement(agreement: AgreementContent) {
 function selectRadio<T extends string>(value: T, setter: (value: T) => void) {
   setter(value)
 }
-
-function isAllDayOnline() {
-  return form.online_start === '00:00' && form.online_end === '23:59'
-}
-
-function isOnlineStartPresetActive(value: string) {
-  return !isAllDayOnline() && form.online_start === value
-}
-
-function isOnlineEndPresetActive(value: string) {
-  return !isAllDayOnline() && form.online_end === value
-}
-
-function selectAllDayOnline() {
-  form.online_start = '00:00'
-  form.online_end = '23:59'
-}
-
-function selectOnlineStart(value: string) {
-  form.online_start = value
-}
-
-function selectOnlineEnd(value: string) {
-  form.online_end = value
-}
 </script>
 
 <template>
@@ -373,6 +358,7 @@ function selectOnlineEnd(value: string) {
               label="在线开始"
               type="time"
               class="publish-field time-field"
+              @update:model-value="handleOnlineStartChange"
             />
             <div class="radio-group small time-preset-chips">
               <button
@@ -388,7 +374,11 @@ function selectOnlineEnd(value: string) {
                 :key="`start-${opt}`"
                 type="button"
                 class="radio-btn"
-                :class="{ active: isOnlineStartPresetActive(opt) }"
+                :class="{
+                  active: isOnlineStartPresetActive(opt),
+                  disabled: disabledOnlineStartOptions.includes(opt),
+                }"
+                :disabled="disabledOnlineStartOptions.includes(opt)"
                 @click="selectOnlineStart(opt)"
               >
                 {{ opt }}
@@ -401,6 +391,7 @@ function selectOnlineEnd(value: string) {
               label="在线结束"
               type="time"
               class="publish-field time-field"
+              @update:model-value="handleOnlineEndChange"
             />
             <div class="radio-group small time-preset-chips">
               <button
@@ -416,7 +407,11 @@ function selectOnlineEnd(value: string) {
                 :key="`end-${opt}`"
                 type="button"
                 class="radio-btn"
-                :class="{ active: isOnlineEndPresetActive(opt) }"
+                :class="{
+                  active: isOnlineEndPresetActive(opt),
+                  disabled: disabledOnlineEndOptions.includes(opt),
+                }"
+                :disabled="disabledOnlineEndOptions.includes(opt)"
                 @click="selectOnlineEnd(opt)"
               >
                 {{ opt }}

frontend/src/features/seller/views/SellerListingCreateView.vue

@@ -32,6 +32,8 @@ const {
   selectedSkins,
   uploadedScreenshotCount,
   requiredScreenshotCount,
+  disabledOnlineStartOptions,
+  disabledOnlineEndOptions,
   serverOptions,
   faceOptions,
   rankOptions,
@@ -74,6 +76,12 @@ const {
   isMultiScreenshotSlot,
   canAddScreenshot,
   getScreenshotLimitHint,
+  isAllDayOnline,
+  selectAllDayOnline,
+  selectOnlineStart,
+  selectOnlineEnd,
+  handleOnlineStartChange,
+  handleOnlineEndChange,
   handleFireLevelInput,
   handleAcceleratedSaleRatioInput,
   useRecommendedDeposit,
@@ -116,23 +124,6 @@ function openPublishAgreement(agreement: AgreementContent) {
 function selectDailyLoss(value: string | number) {
   form.daily_loss_m = Number(value)
 }
-
-function isAllDayOnline() {
-  return form.online_start === '00:00' && form.online_end === '23:59'
-}
-
-function selectAllDayOnline() {
-  form.online_start = '00:00'
-  form.online_end = '23:59'
-}
-
-function selectOnlineStart(value: string | number) {
-  form.online_start = String(value)
-}
-
-function selectOnlineEnd(value: string | number) {
-  form.online_end = String(value)
-}
 </script>
 
 <template>
@@ -161,29 +152,32 @@ function selectOnlineEnd(value: string | number) {
           <div class="compact-grid panel-input-grid">
             <label class="input-block">
               <span>哈夫币/M<b>*</b></span>
-              <el-input-number
+              <el-input
                 v-model="form.haf_coin_amount"
-                :min="0"
+                type="number"
-                :controls="false"
+                inputmode="decimal"
+                min="0"
                 placeholder="100M 写 100"
               />
             </label>
             <label class="input-block">
               <span>绝密KD</span>
-              <el-input-number
+              <el-input
                 v-model="form.secret_kd"
-                :min="0"
+                type="number"
-                :controls="false"
+                inputmode="decimal"
-                :step="0.1"
+                min="0"
+                step="0.1"
                 placeholder="填写绝密KD"
               />
             </label>
             <label class="input-block">
               <span>烽火等级<b>*</b></span>
-              <el-input-number
+              <el-input
                 :model-value="form.fire_level"
-                :min="0"
+                type="number"
-                :controls="false"
+                inputmode="numeric"
+                min="0"
                 :placeholder="fireLevelPlaceholder"
                 @update:model-value="handleFireLevelInput"
               />
@@ -335,6 +329,7 @@ function selectOnlineEnd(value: string | number) {
                   format="HH:mm"
                   placeholder="开始时间"
                   class="time-input"
+                  @change="handleOnlineStartChange"
                 />
                 <div class="time-preset-actions">
                   <button
@@ -348,6 +343,7 @@ function selectOnlineEnd(value: string | number) {
                   <OptionChips
                     :options="commonOnlineTimes"
                     :model-value="isAllDayOnline() ? '' : form.online_start"
+                    :disabled-values="disabledOnlineStartOptions"
                     key-prefix="start-"
                     @select="selectOnlineStart"
                   />
@@ -363,6 +359,7 @@ function selectOnlineEnd(value: string | number) {
                   format="HH:mm"
                   placeholder="结束时间"
                   class="time-input"
+                  @change="handleOnlineEndChange"
                 />
                 <div class="time-preset-actions">
                   <button
@@ -376,6 +373,7 @@ function selectOnlineEnd(value: string | number) {
                   <OptionChips
                     :options="commonOnlineTimes"
                     :model-value="isAllDayOnline() ? '' : form.online_end"
+                    :disabled-values="disabledOnlineEndOptions"
                     key-prefix="end-"
                     @select="selectOnlineEnd"
                   />

frontend/src/features/seller/views/components/OptionChips.vue

@@ -4,6 +4,7 @@ const props = withDefaults(
     options: Array<string | number>
     modelValue?: string | number
     activeValues?: Array<string | number>
+    disabledValues?: Array<string | number>
     keyPrefix?: string
     compact?: boolean
     suffix?: string
@@ -11,6 +12,7 @@ const props = withDefaults(
   {
     modelValue: undefined,
     activeValues: () => [],
+    disabledValues: () => [],
     keyPrefix: '',
     compact: false,
     suffix: '',
@@ -26,7 +28,12 @@ function isActive(value: string | number) {
   return props.activeValues.includes(value) || props.modelValue === value
 }
 
+function isDisabled(value: string | number) {
+  return props.disabledValues.includes(value)
+}
+
 function selectValue(value: string | number) {
+  if (isDisabled(value)) return
   emit('update:modelValue', value)
   emit('select', value)
 }
@@ -39,7 +46,8 @@ function selectValue(value: string | number) {
       :key="`${keyPrefix}${option}`"
       type="button"
       class="chip"
-      :class="{ active: isActive(option) }"
+      :class="{ active: isActive(option), disabled: isDisabled(option) }"
+      :disabled="isDisabled(option)"
       @click="selectValue(option)"
     >
       {{ option }}{{ suffix }}
@@ -81,4 +89,11 @@ function selectValue(value: string | number) {
   background: #ff6a00;
   color: #fff;
 }
+
+.chip.disabled {
+  border-color: #e5e7eb;
+  background: #f3f4f6;
+  color: #a8b0bd;
+  cursor: not-allowed;
+}
 </style>