cfc/cfc-frontend/pages/activity/create.vue

<template>
  <view class="container" :style="{ '--font-scale': fontScale }">
    <view class="form-card">
      <!-- 活动标题 -->
      <view class="form-item">
        <text class="form-label">活动标题 *</text>
        <input class="form-input" v-model="form.title" placeholder="请输入活动标题" maxlength="50" />
      </view>

      <!-- 活动类型 -->
      <view class="form-item">
        <text class="form-label">活动类型 *</text>
        <picker class="form-picker" :value="typeIdx" :range="typeOptions" range-key="label" @change="onTypeChange">
          <text class="picker-text">{{ form.activityType ? typeLabel(form.activityType) : '请选择类型' }}</text>
        </picker>
      </view>

      <!-- 开始时间 -->
      <view class="form-item">
        <text class="form-label">开始时间 *</text>
        <picker class="form-picker" mode="date" :value="datePart" @change="onStartDateChange">
          <text class="picker-text">{{ datePart || '选择日期' }}</text>
        </picker>
        <picker class="form-picker" mode="multiSelector" :range="[hourOptions, minuteOptions]" :value="[hourIdx, minuteIdx]" @change="onStartTimeColChange" style="margin-top: 16rpx;">
          <text class="picker-text">{{ timePart || '选择时间' }}</text>
        </picker>
      </view>

      <!-- 结束时间 -->
      <view class="form-item">
        <text class="form-label">结束时间</text>
        <picker class="form-picker" mode="date" :value="endDatePart" @change="onEndDateChange">
          <text class="picker-text">{{ endDatePart || '选择日期（可选）' }}</text>
        </picker>
        <picker class="form-picker" mode="multiSelector" :range="[hourOptions, minuteOptions]" :value="[endHourIdx, endMinuteIdx]" @change="onEndTimeColChange" style="margin-top: 16rpx;">
          <text class="picker-text">{{ endTimePart || '选择时间（可选）' }}</text>
        </picker>
      </view>

      <!-- 报名截止时间 -->
      <view class="form-item">
        <text class="form-label">报名截止时间</text>
        <picker class="form-picker" mode="date" :value="regDatePart" @change="onRegDateChange">
          <text class="picker-text">{{ regDatePart || '选择日期（不填=活动开始前）' }}</text>
        </picker>
        <picker class="form-picker" mode="multiSelector" :range="[hourOptions, minuteOptions]" :value="[regHourIdx, regMinuteIdx]" @change="onRegTimeColChange" style="margin-top: 16rpx;">
          <text class="picker-text">{{ regTimePart || '选择时间' }}</text>
        </picker>
      </view>

      <!-- 活动地点 -->
      <view class="form-item">
        <text class="form-label">活动地点</text>
        <input class="form-input" v-model="form.location" placeholder="请输入活动地点" maxlength="100" />
      </view>

      <!-- 人数 -->
      <view class="form-item-row">
        <view class="form-item half">
          <text class="form-label">最大人数</text>
          <input class="form-input" type="number" v-model="maxParticipantsStr" placeholder="0=不限" />
        </view>
      </view>

      <!-- A2 §2.1 参加范围（全部用户 / 仅会员参加） -->
      <view class="form-item">
        <text class="form-label">参加范围 *</text>
        <view class="radio-group">
          <label class="radio-item" v-for="opt in scopeOptions" :key="opt.value" @tap="selectScope(opt.value)">
            <view class="radio-icon" :class="{ active: form.audienceScope === opt.value }">
              <view class="radio-inner" v-if="form.audienceScope === opt.value"></view>
            </view>
            <text class="radio-label">{{ opt.label }}</text>
          </label>
        </view>
      </view>

      <!-- A2 §2.1 参与人群（成人恒选，可叠加儿童 / 长者） -->
      <view class="form-item">
        <text class="form-label">参与人群</text>
        <view class="checkbox-group">
          <label class="checkbox-item" v-for="opt in audienceTypeChoices" :key="opt.value" @tap="toggleAudienceType(opt.value)">
            <view class="checkbox-box" :class="{ active: opt.checked }">
              <text class="checkbox-check" v-if="opt.checked">✓</text>
            </view>
            <text class="radio-label">{{ opt.label }}</text>
          </label>
        </view>
        <text class="form-hint">成人始终可参加；勾选「含儿童」后需填写儿童费用</text>
      </view>

      <!-- A2 §2.2 成人档价格 -->
      <view class="form-item-row">
        <view class="form-item half">
          <text class="form-label">价格（元）</text>
          <input class="form-input" type="digit" v-model="priceYuan" placeholder="0=免费" />
        </view>
        <view class="form-item half">
          <text class="form-label">会员价（元）</text>
          <input class="form-input" type="digit" v-model="memberPriceYuan" placeholder="留空=同普通价" />
        </view>
      </view>

      <!-- A2 §2.3 儿童档价格：仅在参与人群含儿童时显示 -->
      <view class="form-item-row" v-if="audienceChild">
        <view class="form-item half">
          <text class="form-label">儿童费用（元）</text>
          <input class="form-input" type="digit" v-model="childFeeYuan" placeholder="0=免费" />
        </view>
        <view class="form-item half">
          <text class="form-label">儿童会员费（元）</text>
          <input class="form-input" type="digit" v-model="childMemberFeeYuan" placeholder="0=免费" />
        </view>
      </view>

      <!-- 主办方 -->
      <view class="form-item">
        <text class="form-label">主办方</text>
        <input class="form-input" v-model="form.vendorName" placeholder="请输入主办方名称（可选）" maxlength="50" />
      </view>

      <!-- 封面图片 -->
      <view class="form-item">
        <text class="form-label">封面图片</text>
        <view class="cover-upload" @click="chooseImage">
          <image v-if="form.coverImage" class="preview-img" :src="getCoverUrl(form.coverImage)" mode="aspectFill" @click.stop  lazy-load />
          <view v-else class="upload-placeholder">
            <text class="upload-icon">📷</text>
            <text class="upload-text">点击上传封面图</text>
          </view>
        </view>
        <view class="cover-actions" v-if="form.coverImage">
          <text class="cover-action" @click="chooseImage">重新选择</text>
          <text class="cover-action-danger" @click="removeCover">移除</text>
        </view>
      </view>

      <!-- 活动简介（列表卡片与分享海报优先展示，一句到两句为宜） -->
      <view class="form-item">
        <text class="form-label">活动简介</text>
        <textarea class="form-textarea" v-model="form.intro" placeholder="一句话说明这个活动是什么（可选，建议不超过 60 字）" maxlength="100"
          auto-height />
      </view>

      <!-- 活动描述 -->
      <view class="form-item">
        <text class="form-label">活动描述</text>
        <textarea class="form-textarea" v-model="form.description" placeholder="请输入活动详细介绍" maxlength="500"
          auto-height />
      </view>

      <!-- 操作按钮 -->
      <view class="form-actions">
        <view class="btn-save" @click="handleSave">
          <text>保存为草稿</text>
        </view>
        <view class="btn-publish" @click="handlePublish">
          <text>{{ isAdmin ? '保存并发布' : '保存并提交审核' }}</text>
        </view>
      </view>
    </view>

    <!-- 海报模板选择 + 预览 -->
    <view class="form-card" v-if="posterTemplates.length > 0">
      <view class="form-title">活动海报模板（可选）</view>
      <view class="poster-tpl-list">
        <view
          v-for="tpl in posterTemplates"
          :key="tpl.id"
          class="poster-tpl-card"
          :class="{ 'poster-tpl-active': form.posterTemplateId === tpl.id }"
          @click="selectPosterTemplate(tpl)"
        >
          <view class="tpl-colors">
            <view class="tpl-dot tpl-main" :style="{ background: tpl.mainColor || BrandColors.primary }"></view>
            <view class="tpl-dot tpl-dark" :style="{ background: tpl.darkColor || BrandColors.orangeDeep }"></view>
            <view class="tpl-dot tpl-light" :style="{ background: tpl.lightColor || paleColor }"></view>
          </view>
          <text class="tpl-name">{{ tpl.name }}</text>
        </view>
      </view>
      <view class="poster-preview-row" v-if="form.posterTemplateId">
        <text class="poster-preview-hint">已选择海报模板，点击「预览」查看效果</text>
        <view class="btn-preview" @click="openPosterPreview">预览</view>
      </view>
    </view>

    <!-- 海报预览弹层 -->
    <content-share-poster
      v-if="showPosterPreview"
      :show="showPosterPreview"
      :title="form.title || '活动海报'"
      :cover-image="form.coverImage"
      :dimension-code="form.dimensionCode"
      :template="previewTemplateKey"
      :templates="posterTemplates"
      :poster-qr-code="''"
      @close="showPosterPreview = false"
      @update:template="previewTemplateKey = $event"
      @update:bgColor="previewBgColor = $event"
    ></content-share-poster>

    <view class="loading" v-if="loading">
      <view class="loading-spinner"></view>
      <text>加载中...</text>
    </view>
  </view>
</template>

<script>
import { BrandColors } from '../../utils/brand-colors.js'
import { adminCreateActivity, adminUpdateActivity, adminPublishActivity, submitActivityForReview, getActivityDetail, getPosterTemplates } from '../../utils/api.js'
import config from '../../config.js'
import { parseDate } from '../../utils/format.js'
import { hasActivityManageRole } from '../../utils/activity-role.js'
import { pickImage } from '../../utils/image-picker.js'
import ContentSharePoster from '../../components/ContentSharePoster.vue'

var BASE_URL = config.api('')
import fontScaleMixin from '@/mixins/font-scale.js'

export default {
  mixins: [fontScaleMixin],
  components: { ContentSharePoster },
  computed: {
    // 后台活动管理员可直接发布；服务商账号只能保存后提交审核
    isAdmin: function() {
      return hasActivityManageRole()
    },
    // A2 §2.1 参与人群勾选视图（成人恒选，不允许取消；勾选状态映射到 audienceChild/audienceElder）
    audienceTypeChoices: function() {
      var self = this
      return this.audienceTypeOptions.map(function(opt) {
        var checked = opt.value === 'adult' || self.isAudienceTypeChecked(opt.value)
        return { value: opt.value, label: opt.label, checked: checked }
      })
    },
    // A2 §2.1 提交给后端的 audience_type 合并取值
    audienceTypeValue: function() {
      if (this.audienceChild && this.audienceElder) return 'include_child_elder'
      if (this.audienceChild) return 'include_child'
      if (this.audienceElder) return 'include_elder'
      return 'adult'
    }
  },
  data() {
    return {
      paleColor: BrandColors.primaryPale,
      isNew: true,
      activityId: null,
      loading: false,
      memberId: '',
      form: {
        title: '',
        intro: '',
        description: '',
        intro: '',
        coverImage: '',
        dimensionCode: '',
        activityType: '',
        status: 'draft',
        startTime: null,
        endTime: null,
        registrationDeadline: null,
        location: '',
        maxParticipants: 0,
        childFee: 0,
        childMemberFee: 0,
        // A2 §2.1 适用人群：audienceScope=全部用户/仅会员参加；audienceType=参与人群构成
        audienceScope: 'all',
        audienceType: 'adult',
        visibility: 'public',
        requireRegistration: 1,
        requireCheckinReview: 0,
        checkinPoints: 0
      },
      // A2 §2.2 成人档价格输入（元）；空 = 走默认/别名回退
      priceYuan: '',
      memberPriceYuan: '',
      // 存量活动的 memberPrice 为 NULL（从未写入过），提交时需保持 NULL 以继续沿用 parentMemberFee 别名
      memberPriceWasNull: false,
      // 存量活动已有的儿童收费（用于「未勾选含儿童」时不误清零存量收费）
      legacyChildFee: 0,
      legacyChildMemberFee: 0,
      // A2 §2.1 参与人群勾选状态（成人恒选，不提供取消）
      audienceChild: false,
      audienceElder: false,
      scopeOptions: [
        { value: 'all', label: '全部用户' },
        { value: 'member_only', label: '仅会员参加' }
      ],
      audienceTypeOptions: [
        { value: 'adult', label: '成人' },
        { value: 'include_child', label: '含儿童' },
        { value: 'include_elder', label: '含长者' }
      ],
      childFeeYuan: '0',
      childMemberFeeYuan: '0',
      maxParticipantsStr: '0',
      datePart: '',
      timePart: '',
      endDatePart: '',
      endTimePart: '',
      regDatePart: '',
      regTimePart: '',
      // 时间选择器（multiSelector 双列）：时 24 项 00..23，分 12 项严格 5 分钟粒度
      hourOptions: ['00', '01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23'],
      minuteOptions: ['00', '05', '10', '15', '20', '25', '30', '35', '40', '45', '50', '55'],
      hourIdx: 0,
      minuteIdx: 0,
      endHourIdx: 0,
      endMinuteIdx: 0,
      regHourIdx: 0,
      regMinuteIdx: 0,
      typeIdx: 0,
      typeOptions: [
        { key: 'offline', label: '线下活动' },
        { key: 'online', label: '线上活动' },
        { key: 'campaign', label: '营销活动' }
      ],
      // 海报模板
      posterTemplates: [],
      selectedPosterTemplate: null,
      showPosterPreview: false,
      previewTemplateKey: 'gradient',
      previewBgColor: ''
    }
  },
  onLoad(options) {
    if (options.id) {
      this.activityId = parseInt(options.id)
      this.isNew = false
      uni.setNavigationBarTitle({ title: '编辑活动' })
      this.loadDetail()
    } else {
      uni.setNavigationBarTitle({ title: '创建活动' })
    }
    // 加载海报模板列表（未登录也会返回空列表，不阻塞创建）
    this.loadPosterTemplates()
  },
  methods: {
    loadDetail() {
      var self = this
      self.loading = true
      getActivityDetail(self.activityId).then(function(res) {
        self.loading = false
        if (res && res.code === 200 && res.data) {
          var d = res.data
          self.form.title = d.title || ''
          self.form.intro = d.intro || ''
          self.form.description = d.description || ''
          self.form.intro = d.intro || ''
          self.form.coverImage = d.coverImage || ''
          self.form.vendorName = d.vendorName || ''
          self.form.posterTemplateId = d.posterTemplateId || null
          self.form.dimensionCode = d.dimensionCode || ''
          self.form.activityType = d.activityType || ''
          self.form.location = d.location || ''
          self.form.maxParticipants = d.maxParticipants || 0
          self.form.childFee = d.childFee || 0
          self.form.childMemberFee = d.childMemberFee || 0
          // A2：不再回填 parentFee/parentMemberFee 到 form（历史别名，不再提交），仅按需取旧值兜底价格显示
          self.form.audienceScope = d.audienceScope || 'all'
          self.form.audienceType = d.audienceType || 'adult'
          self.form.status = d.status || 'draft'
          self.form.visibility = d.visibility || 'public'
          self.maxParticipantsStr = String(self.form.maxParticipants)
          self.childFeeYuan = self.form.childFee ? (self.form.childFee / 100).toString() : '0'
          self.childMemberFeeYuan = self.form.childMemberFee ? (self.form.childMemberFee / 100).toString() : '0'
          // A2 §2.3 存量活动已有的儿童收费：未勾选「含儿童」时不误清零，先暂存
          self.legacyChildFee = self.form.childFee || 0
          self.legacyChildMemberFee = self.form.childMemberFee || 0
          // A2 §2.2 成人档价格回填：用 basePrice（原始普通价）而非 price（会员已解析展示值），
          // 否则会员编辑时误把会员价当成普通价回写；basePrice 为 0/空时兜底历史别名 parentFee
          var basePrice = d.basePrice || 0
          var legacyPrice = (basePrice > 0) ? basePrice : (d.parentFee || 0)
          self.priceYuan = legacyPrice ? (legacyPrice / 100).toString() : ''
          // memberPrice 为 NULL 表示存量活动从未写入过（结算走 parentMemberFee 别名），需保留该状态
          self.memberPriceWasNull = (d.memberPrice === null || d.memberPrice === undefined)
          var legacyMemberPrice = 0
          if (d.memberPrice && d.memberPrice > 0) {
            legacyMemberPrice = d.memberPrice
          } else if (self.memberPriceWasNull && d.parentMemberFee && d.parentMemberFee > 0) {
            legacyMemberPrice = d.parentMemberFee
          }
          self.memberPriceYuan = legacyMemberPrice ? (legacyMemberPrice / 100).toString() : ''
          // A2 §2.1 参与人群勾选状态回填
          var at = d.audienceType || 'adult'
          self.audienceChild = (at === 'include_child' || at === 'include_child_elder')
          self.audienceElder = (at === 'include_elder' || at === 'include_child_elder')
          if (d.startTime) {
            var sd = parseDate(d.startTime)
            if (sd) {
              self.datePart = self.fmtDate(sd)
              self.timePart = self.fmtTime(sd)
              // 反算时/分列索引，picker 回填显示与提交值保持一致（均为 5 分钟粒度）
              self.applyTimeParts(self.timePart, 'hourIdx', 'minuteIdx')
              // 走 sync 统一组装：timePart 已被 fmtTime 收敛到 5 的倍数，保证"显示即提交"
              self.syncStartTime()
            }
          }
          if (d.endTime) {
            var ed = parseDate(d.endTime)
            if (ed) {
              self.endDatePart = self.fmtDate(ed)
              self.endTimePart = self.fmtTime(ed)
              self.applyTimeParts(self.endTimePart, 'endHourIdx', 'endMinuteIdx')
              self.syncEndTime()
            }
          }
          if (d.registrationDeadline) {
            var rd = parseDate(d.registrationDeadline)
            if (rd) {
              self.regDatePart = self.fmtDate(rd)
              self.regTimePart = self.fmtTime(rd)
              self.applyTimeParts(self.regTimePart, 'regHourIdx', 'regMinuteIdx')
              self.syncRegDeadline()
            }
          }
          // sync type picker
          for (var j = 0; j < self.typeOptions.length; j++) {
            if (self.typeOptions[j].key === self.form.activityType) self.typeIdx = j
          }
        }
      }).catch(function() { self.loading = false })
    },
    onTypeChange(e) {
      this.typeIdx = e.detail.value
      this.form.activityType = this.typeOptions[this.typeIdx].key
    },
    // A2 §2.1 选择参加范围（全部用户 / 仅会员参加）
    selectScope(value) {
      this.form.audienceScope = value
    },
    // A2 §2.1 勾选参与人群（成人恒选，不允许取消）
    toggleAudienceType(value) {
      if (value === 'adult') return
      if (value === 'include_child') this.audienceChild = !this.audienceChild
      if (value === 'include_elder') this.audienceElder = !this.audienceElder
    },
    // A2 §2.1 判断某参与人群选项是否已勾选
    isAudienceTypeChecked(value) {
      if (value === 'adult') return true
      if (value === 'include_child') return this.audienceChild
      if (value === 'include_elder') return this.audienceElder
      return false
    },
    onStartDateChange(e) {
      this.datePart = e.detail.value
      this.syncStartTime()
    },
    onStartTimeColChange(e) {
      // multiSelector 双列：时/分列索引直取 options 值，选择过程中即 5 分钟粒度，无需事后取整
      var v = e.detail.value
      this.hourIdx = v[0]
      this.minuteIdx = v[1]
      this.timePart = this.hourOptions[v[0]] + ':' + this.minuteOptions[v[1]]
      this.syncStartTime()
    },
    onEndDateChange(e) {
      this.endDatePart = e.detail.value
      this.syncEndTime()
    },
    onEndTimeColChange(e) {
      var v = e.detail.value
      this.endHourIdx = v[0]
      this.endMinuteIdx = v[1]
      this.endTimePart = this.hourOptions[v[0]] + ':' + this.minuteOptions[v[1]]
      this.syncEndTime()
    },
    onRegDateChange(e) {
      this.regDatePart = e.detail.value
      this.syncRegDeadline()
    },
    onRegTimeColChange(e) {
      var v = e.detail.value
      this.regHourIdx = v[0]
      this.regMinuteIdx = v[1]
      this.regTimePart = this.hourOptions[v[0]] + ':' + this.minuteOptions[v[1]]
      this.syncRegDeadline()
    },
    // 活动时间统一为 5 分钟粒度：分钟向下取整到 5 的倍数（14:07 → 14:05、14:59 → 14:55）
    // 兜底保留：历史脏数据、后台/接口写入非 5 倍数分钟时仍能收敛（选择器本身已无法选中非 5 倍数）
    normalizeTimeTo5Min: function(t) {
      if (!t) return t
      var parts = String(t).split(':')
      if (parts.length < 2) return t
      var h = parseInt(parts[0], 10)
      var mi = parseInt(parts[1], 10)
      if (isNaN(h) || isNaN(mi)) return t
      mi = Math.floor(mi / 5) * 5
      return ('0' + h).slice(-2) + ':' + ('0' + mi).slice(-2)
    },
    // 把 HH:MM 字符串同步到 picker 时/分列索引（先归一化到 5 分钟粒度，保证"显示即提交"）
    // 供初始化、历史回填与列变更回写共用；hourIdxRef/minuteIdxRef 为 data 字段名
    applyTimeParts: function(t, hourIdxRef, minuteIdxRef) {
      var s = this.normalizeTimeTo5Min(t)
      if (!s) return
      var parts = String(s).split(':')
      this[hourIdxRef] = parseInt(parts[0], 10)
      this[minuteIdxRef] = Math.floor(parseInt(parts[1], 10) / 5)
    },
    syncStartTime() {
      if (this.datePart && this.timePart) {
        this.form.startTime = this.datePart + 'T' + this.timePart + ':00'
      }
    },
    syncEndTime() {
      if (this.endDatePart && this.endTimePart) {
        this.form.endTime = this.endDatePart + 'T' + this.endTimePart + ':00'
      } else {
        this.form.endTime = null
      }
    },
    syncRegDeadline() {
      if (this.regDatePart && this.regTimePart) {
        this.form.registrationDeadline = this.regDatePart + 'T' + this.regTimePart + ':00'
      } else {
        this.form.registrationDeadline = null
      }
    },
    chooseImage() {
      var self = this
      pickImage({
        count: 1,
        sizeType: ['compressed'],
        success: function(res) {
          self.uploadCover(res.tempFilePaths[0])
        }
      })
    },
    uploadCover(filePath) {
      var self = this
      uni.uploadFile({
        url: BASE_URL + '/api/admin/articles/upload/image',
        filePath: filePath,
        name: 'file',
        header: { 'Authorization': 'Bearer ' + (uni.getStorageSync('token') || '') },
        success: function(res) {
          try {
            var data = JSON.parse(res.data)
            if (data.code === 200 && data.data) {
              self.form.coverImage = data.data
            } else {
              uni.showToast({ title: '上传失败', icon: 'none' })
            }
          } catch (e) {
            uni.showToast({ title: '上传失败', icon: 'none' })
          }
        },
        fail: function() {
          uni.showToast({ title: '上传失败', icon: 'none' })
        }
      })
    },
    onImgError() {
      this.form.coverImage = ''
    },
    getCoverUrl(path) {
      if (!path) return ''
      var s = String(path).trim()
      if (!s || s === 'null' || s === '/null') return ''
      if (s.indexOf('http://') === 0 || s.indexOf('https://') === 0) return s
      return BASE_URL + (s.charAt(0) === '/' ? s : '/' + s)
    },
    removeCover() {
      this.form.coverImage = ''
    },
    async loadPosterTemplates() {
      try {
        var res = await getPosterTemplates()
        if (res && res.code === 200) {
          this.posterTemplates = res.data || []
        }
      } catch (e) { /* 模板拉取失败不影响创建 */ }
    },
    selectPosterTemplate(tpl) {
      this.form.posterTemplateId = tpl.id
      this.selectedPosterTemplate = tpl
      this.previewTemplateKey = tpl.templateKey || 'gradient'
      // 默认背景色取模板主色
      this.previewBgColor = tpl.mainColor || ''
      uni.showToast({ title: '已选择：' + tpl.name, icon: 'none' })
    },
    openPosterPreview() {
      if (!this.form.posterTemplateId) {
        uni.showToast({ title: '请先选择海报模板', icon: 'none' })
        return
      }
      this.showPosterPreview = true
    },
    validate() {
      if (!this.form.title) {
        uni.showToast({ title: '请输入活动标题', icon: 'none' })
        return false
      }
      if (!this.form.activityType) {
        uni.showToast({ title: '请选择活动类型', icon: 'none' })
        return false
      }
      if (!this.datePart || !this.timePart) {
        uni.showToast({ title: '请选择开始时间', icon: 'none' })
        return false
      }
      return true
    },
    buildPayload() {
      var payload = Object.assign({}, this.form)
      payload.maxParticipants = parseInt(this.maxParticipantsStr) || 0
      // A2 §2.1 适用人群：参加范围 + 参与人群构成
      payload.audienceScope = this.form.audienceScope || 'all'
      payload.audienceType = this.audienceTypeValue
      // A2 §2.2 成人档价格：price 为普通价；memberPrice 留空 = 同普通价
      payload.price = Math.round((parseFloat(this.priceYuan) || 0) * 100)
      if (this.memberPriceYuan) {
        payload.memberPrice = Math.round((parseFloat(this.memberPriceYuan) || 0) * 100)
      } else if (this.memberPriceWasNull) {
        // 存量活动 memberPrice 从未写入过（NULL）：保持 NULL，继续沿用 parentMemberFee 历史别名
        delete payload.memberPrice
      } else {
        payload.memberPrice = 0
      }
      // A2 §2.3 儿童档价格：仅在参与人群含儿童时提交
      if (this.audienceChild) {
        payload.childFee = Math.round((parseFloat(this.childFeeYuan) || 0) * 100)
        payload.childMemberFee = Math.round((parseFloat(this.childMemberFeeYuan) || 0) * 100)
      } else if (this.legacyChildFee || this.legacyChildMemberFee) {
        // 存量活动已有儿童收费但本次未勾选「含儿童」：不改存量收费，避免误清零
        delete payload.childFee
        delete payload.childMemberFee
      } else {
        payload.childFee = 0
        payload.childMemberFee = 0
      }
      // A2 §2.2 parentFee/parentMemberFee 降级为历史别名，表单不再提交（null 字段不参与 updateById）
      delete payload.parentFee
      delete payload.parentMemberFee
      if (this.activityId) payload.id = this.activityId
      // 维度由审核时设置，创建/编辑不提交空维度，避免误清空已有维度
      if (!payload.dimensionCode) delete payload.dimensionCode
      // 主办方和海报模板仅非空时提交
      if (!payload.vendorName) delete payload.vendorName
      if (!payload.posterTemplateId) delete payload.posterTemplateId
      // 简介为空时不提交，保留后端已有值
      if (!payload.intro) delete payload.intro
      return payload
    },
    handleSave() {
      if (!this.validate()) return
      this.submit(false)
    },
    handlePublish() {
      if (!this.validate()) return
      this.submit(true)
    },
    submit(publishAfter) {
      var self = this
      self.loading = true
      var payload = self.buildPayload()
      var isAdmin = self.isAdmin

      var doPublish = function(id) {
        if (isAdmin) {
          adminPublishActivity(id).then(function(r) {
            self.loading = false
            if (r && r.code === 200) {
              uni.showToast({ title: '已发布', icon: 'success' })
              setTimeout(function() {
                uni.navigateBack()
              }, 1200)
            } else {
              uni.showToast({ title: (r && r.message) || '发布失败', icon: 'none' })
            }
          }).catch(function() {
            self.loading = false
            uni.showToast({ title: '发布失败', icon: 'none' })
          })
        } else {
          submitActivityForReview(id).then(function(r) {
            self.loading = false
            if (r && r.code === 200) {
              uni.showToast({ title: '已提交审核', icon: 'success' })
              setTimeout(function() {
                uni.navigateBack()
              }, 1200)
            } else {
              uni.showToast({ title: (r && r.message) || '提交审核失败', icon: 'none' })
            }
          }).catch(function() {
            self.loading = false
            uni.showToast({ title: '提交审核失败', icon: 'none' })
          })
        }
      }

      if (self.isNew) {
        adminCreateActivity(payload).then(function(res) {
          if (res && res.code === 200) {
            var newId = res.data.id || res.data
            if (publishAfter) {
              doPublish(newId)
            } else {
              self.loading = false
              uni.showToast({ title: '已保存草稿', icon: 'success' })
              setTimeout(function() { uni.navigateBack() }, 1200)
            }
          } else {
            self.loading = false
            uni.showToast({ title: (res && res.message) || '保存失败', icon: 'none' })
          }
        }).catch(function() {
          self.loading = false
          uni.showToast({ title: '网络异常', icon: 'none' })
        })
      } else {
        adminUpdateActivity(payload).then(function(res) {
          if (res && res.code === 200) {
            if (publishAfter && (self.form.status === 'draft' || self.form.status === 'rejected')) {
              doPublish(self.activityId)
            } else {
              self.loading = false
              uni.showToast({ title: '已保存', icon: 'success' })
              setTimeout(function() { uni.navigateBack() }, 1200)
            }
          } else {
            self.loading = false
            uni.showToast({ title: (res && res.message) || '保存失败', icon: 'none' })
          }
        }).catch(function() {
          self.loading = false
          uni.showToast({ title: '网络异常', icon: 'none' })
        })
      }
    },
    typeLabel(key) {
      for (var i = 0; i < this.typeOptions.length; i++) {
        if (this.typeOptions[i].key === key) return this.typeOptions[i].label
      }
      return '请选择类型'
    },
    fmtDate(d) {
      var y = d.getFullYear()
      var m = ('0' + (d.getMonth() + 1)).slice(-2)
      var day = ('0' + d.getDate()).slice(-2)
      return y + '-' + m + '-' + day
    },
    fmtTime(d) {
      var h = ('0' + d.getHours()).slice(-2)
      var mi = ('0' + d.getMinutes()).slice(-2)
      // 回填同样收敛到 5 分钟粒度，避免历史非 5 倍数分钟再次保存前产生"选了 7 分却变 5 分"的困惑
      return this.normalizeTimeTo5Min(h + ':' + mi)
    }
  }
}
</script>

<style scoped lang="scss">
.container {
  min-height: 100vh;
  background: $app-bg;
  padding: 24rpx;
}

.form-card {
  background: $app-surface;
  border-radius: 24rpx;
  padding: 32rpx 28rpx;
  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
}

.form-title {
  font-size: calc(36rpx * var(--font-scale, 1));
  font-weight: bold;
  color: $uni-text-color;
  margin-bottom: 24rpx;
}

.form-item {
  margin-bottom: 28rpx;
}

.form-item-row {
  display: flex;
  flex-direction: row;
  gap: 20rpx;
  margin-bottom: 28rpx;
}

.form-item.half {
  flex: 1;
}

.form-label {
  font-size: calc(26rpx * var(--font-scale, 1));
  color: $facade-text-slate-deep;
  font-weight: 600;
  margin-bottom: 12rpx;
  display: block;
}

.form-input {
  width: 100%;
  height: 80rpx;
  border: 1rpx solid $uni-border-color-light;
  border-radius: 16rpx;
  padding: 0 20rpx;
  font-size: calc(28rpx * var(--font-scale, 1));
  color: $uni-text-color;
  box-sizing: border-box;
}

/* A2 §2.1 参加范围单选（样式对齐 components/GenerationPicker.vue） */
.radio-group {
  display: flex;
  flex-direction: row;
  gap: 24rpx;
}

.radio-item {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.radio-icon {
  width: 36rpx;
  height: 36rpx;
  border: 2rpx solid $facade-border-soft;
  border-radius: 50%;
  margin-right: 12rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}

.radio-icon.active {
  border-color: $brand-primary;
}

.radio-inner {
  width: 18rpx;
  height: 18rpx;
  background: $brand-primary;
  border-radius: 50%;
}

.radio-label {
  font-size: calc(28rpx * var(--font-scale, 1));
  color: $facade-text-strong;
}

/* A2 §2.1 参与人群多选 */
.checkbox-group {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20rpx;
}

.checkbox-item {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.checkbox-box {
  width: 36rpx;
  height: 36rpx;
  border: 2rpx solid $facade-border-soft;
  border-radius: 8rpx;
  margin-right: 12rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}

.checkbox-box.active {
  border-color: $brand-primary;
  background: $brand-primary;
}

.checkbox-check {
  color: #FFFFFF;
  font-size: 24rpx;
  line-height: 1;
}

/* A2 §2.1 表单提示文案 */
.form-hint {
  display: block;
  font-size: 24rpx;
  color: $facade-text-slate;
  margin-top: 12rpx;
}


.form-picker {
  width: 100%;
  height: 80rpx;
  border: 1rpx solid $uni-border-color-light;
  border-radius: 16rpx;
  padding: 0 20rpx;
  font-size: calc(28rpx * var(--font-scale, 1));
  color: $uni-text-color;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.picker-text {
  font-size: calc(28rpx * var(--font-scale, 1));
  color: $uni-text-color;
}

.form-textarea {
  width: 100%;
  min-height: 160rpx;
  border: 1rpx solid $uni-border-color-light;
  border-radius: 16rpx;
  padding: 16rpx 20rpx;
  font-size: calc(28rpx * var(--font-scale, 1));
  color: $uni-text-color;
  box-sizing: border-box;
}

.cover-upload {
  width: 100%;
  height: 320rpx;
  border: 2rpx dashed $uni-border-color;
  border-radius: 16rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.preview-img {
  width: 100%;
  height: 100%;
}

.upload-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.upload-icon {
  font-size: calc($uni-font-size-4xl * var(--font-scale, 1));
  color: $app-text-subtle;
}

.upload-text {
  font-size: calc(24rpx * var(--font-scale, 1));
  color: $app-text-subtle;
  margin-top: 8rpx;
}

.cover-actions {
  display: flex;
  flex-direction: row;
  gap: 24rpx;
  margin-top: 12rpx;
}

.cover-action {
  font-size: calc(24rpx * var(--font-scale, 1));
  color: $facade-text-slate-deep;
  text-decoration: underline;
}

.cover-action-danger {
  font-size: calc(24rpx * var(--font-scale, 1));
  color: $status-danger;
  text-decoration: underline;
}

/* 海报模板选择 */
.poster-tpl-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16rpx;
  margin-top: 20rpx;
}

.poster-tpl-card {
  width: 200rpx;
  border: 2rpx solid $uni-border-color-light;
  border-radius: 16rpx;
  padding: 20rpx 16rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: $app-surface;
}

.poster-tpl-active {
  border-color: $brand-primary;
  background: $uni-primary-pale;
}

.tpl-colors {
  display: flex;
  flex-direction: row;
  gap: 8rpx;
  margin-bottom: 12rpx;
}

.tpl-dot {
  width: 32rpx;
  height: 32rpx;
  border-radius: 50%;
}

.tpl-name {
  font-size: calc(24rpx * var(--font-scale, 1));
  color: $uni-text-color;
  text-align: center;
}

.poster-preview-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-top: 20rpx;
}

.poster-preview-hint {
  font-size: calc(24rpx * var(--font-scale, 1));
  color: $uni-text-color-secondary;
}

.btn-preview {
  padding: 12rpx 32rpx;
  border-radius: 24rpx;
  background: $brand-primary;
  color: $app-surface;
  font-size: calc(26rpx * var(--font-scale, 1));
}

.form-actions {
  display: flex;
  flex-direction: row;
  gap: 20rpx;
  margin-top: 40rpx;
}

.btn-save,
.btn-publish {
  flex: 1;
  height: 88rpx;
  border-radius: 24rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(30rpx * var(--font-scale, 1));
  font-weight: 600;
}

.btn-save {
  background: $app-surface;
  color: $brand-primary;
  border: 2rpx solid $brand-primary;
}

.btn-publish {
  background: linear-gradient(135deg, $brand-primary, $brand-primary-light);
  color: $app-surface;
}

.loading {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.6);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 999;
}

.loading-spinner {
  width: 60rpx;
  height: 60rpx;
  border: 4rpx solid $brand-primary-light-2;
  border-top: 4rpx solid $brand-primary;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  margin-bottom: 16rpx;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}
</style>