<!-- pages/jisufd/jisufd.wxml -->
<view class="page-container">
  <!-- 余额卡片 -->
  <view class="balance-card">
    <text class="balance-label">可用余额</text>
    <view class="balance-amount">
      <text class="amount-value">{{sjyue}}</text>
      <text class="amount-unit">元</text>
    </view>
    <text class="balance-tip">生成链接将从此余额扣除</text>
  </view>

  <!-- 商品类型选择 -->
  <view class="section">
    <text class="section-title">选择订单类型</text>
    <scroll-view class="type-scroll" scroll-x="true" enable-flex>
      <block wx:for="{{shangpinList}}" wx:key="id">
        <view class="type-item {{selectedTypeId === item.id ? 'type-active' : ''}}"
              data-id="{{item.id}}" data-item="{{item}}" bindtap="onSelectType">
          <text class="type-text">{{item.jieshao}}</text>
        </view>
      </block>
    </scroll-view>
  </view>

  <!-- 搜索区域 -->
  <view class="search-section">
    <view class="search-box">
      <text class="search-icon">🔍</text>
      <input class="search-input" placeholder="输入模板ID/介绍..." value="{{searchParams.keyword}}"
             bindinput="onSearchKeywordInput" bindconfirm="onSearchConfirm"/>
      <view class="search-btn" bindtap="onSearchConfirm">
        <text class="search-btn-text">搜索</text>
      </view>
    </view>
    <view class="filter-row">
      <view class="filter-item">
        <text class="filter-label">金额≥</text>
        <input class="filter-input" type="digit" placeholder="元" value="{{searchParams.minPrice}}" bindinput="onSearchMinPriceInput"/>
      </view>
      <view class="filter-item">
        <text class="filter-label">标签</text>
        <picker mode="selector" range="{{currentTypeChenghaoList}}" range-key="mingcheng" bindchange="onSearchLabelChange">
          <view class="picker-view">
            <text>{{searchLabelName || '全部'}}</text>
          </view>
        </picker>
      </view>
      <view class="clear-search" bindtap="onClearSearch"><text>清空</text></view>
    </view>
  </view>

  <!-- 模板卡片网格 -->
  <view class="template-section">
    <scroll-view class="template-scroll" scroll-y="true" scroll-with-animation="true" bindscrolltolower="onScrollToLower">
      <view class="template-grid">
        <block wx:for="{{templateList}}" wx:key="mobanId">
          <view class="template-card" bindtap="onCardTap" data-item="{{item}}">
            <view class="template-intro">
              <text class="intro-text">{{item.jieshao || '无介绍'}}</text>
            </view>
            <view class="template-label" wx:if="{{item.labelName}}">
              <chenghao-tag mingcheng="{{item.labelName}}" texiaoJson="{{''}}"/>
            </view>
            <view class="template-price-row">
              <text class="template-price-label">价格:</text>
              <text class="template-price-value">{{item.jiage || '0.00'}}元</text>
            </view>
            <view class="template-actions-grid">
              <view class="action-grid-btn generate-grid-btn {{item.hasGenerated ? 'generated' : ''}}"
                    data-id="{{item.mobanId}}" catchtap="onGenerateLink">
                {{item.hasGenerated ? '获取新链接' : '生成链接'}}
              </view>
              <view class="action-grid-btn copy-grid-btn {{item.isCopied ? 'copied' : ''}}"
                    data-id="{{item.mobanId}}" catchtap="onCopyLink">
                {{item.isCopied ? '已复制' : '一键复制'}}
              </view>
            </view>
          </view>
        </block>
        <view class="template-card add-card" bindtap="showAddModal">
          <view class="add-icon">➕</view>
          <text class="add-text">添加模板</text>
          <text class="add-subtext">点击创建新模板</text>
        </view>
      </view>
      <view class="load-more" wx:if="{{isLoadingMore}}">...</view>
      <view class="no-more" wx:if="{{!hasMoreData && templateList.length > 0}}">没有更多模板了</view>
      <view class="empty-state" wx:if="{{templateList.length === 0 && !isLoading}}">暂无模板</view>
    </scroll-view>
  </view>
</view>

<!-- 详情弹窗 -->
<view class="modal-overlay" wx:if="{{showDetailModal}}" bindtap="hideDetailModal">
  <view class="modal-content detail-modal" catchtap="stopPropagation">
    <view class="modal-close" bindtap="hideDetailModal">×</view>
    <view class="modal-header"><text class="modal-title">模板详情</text></view>
    <view class="detail-info" wx:if="{{currentTemplate}}">
      <view class="detail-item">
        <text class="detail-label">订单介绍</text>
        <view class="detail-value intro-value"><text>{{currentTemplate.jieshao || '无介绍'}}</text></view>
      </view>
      <view class="detail-item" wx:if="{{currentTemplate.labelName}}">
        <text class="detail-label">关联标签</text>
        <chenghao-tag mingcheng="{{currentTemplate.labelName}}" texiaoJson="{{currentTemplate.texiaoJson}}"/>
     </view>
      <view class="detail-meta-row">
        <view class="meta-item"><text class="meta-label">价格</text><text class="meta-value price-meta">{{currentTemplate.jiage || '0.00'}}元</text></view>
        <view class="meta-divider">|</view>
        <view class="meta-item"><text class="meta-label">发布数量</text><text class="meta-value count-meta">{{currentTemplate.fabushuliang || 0}}次</text></view>
        <view class="meta-divider">|</view>
        <view class="meta-item"><text class="meta-label">模板ID</text><text class="meta-value id-meta">{{currentTemplate.mobanId || 'N/A'}}</text></view>
      </view>
      <view class="detail-item" wx:if="{{currentTemplate.commissionEnabled}}">
        <text class="detail-label">佣金要求</text>
        <text class="detail-value">{{currentTemplate.commissionValue}}元（建议≤50）</text>
      </view>
      <!-- 链接筛选 -->
      <view class="link-filter-bar">
        <text class="filter-label">链接状态：</text>
        <view class="filter-switch {{detailLinkFilter === 0 ? 'active' : ''}}" bindtap="onToggleLinkFilter">未使用</view>
        <view class="filter-switch {{detailLinkFilter === 1 ? 'active' : ''}}" bindtap="onToggleLinkFilter">已使用</view>
      </view>
      <scroll-view class="link-list" scroll-y="true" style="max-height: 300rpx;">
        <block wx:for="{{detailLinkList}}" wx:key="id">
          <view class="link-item">
            <text class="link-url" selectable="true">{{item.lianjie}}</text>
            <text class="link-status">{{item.is_used ? '已使用' : '未使用'}}</text>
            <view wx:if="{{!item.is_used}}" class="copy-link-btn" bindtap="onCopyLinkItem" data-url="{{item.lianjie}}">复制</view>
          </view>
        </block>
        <view class="load-more-links" wx:if="{{detailLinkHasMore}}">
          <view class="load-more-btn" bindtap="onLoadMoreLinks">获取更多链接</view>
        </view>
        <view wx:if="{{isLoadingLinks}}" class="link-loading">加载中...</view>
        <view wx:if="{{detailLinkList.length === 0 && !isLoadingLinks}}" class="link-empty">暂无链接</view>
      </scroll-view>
    </view>
    <view class="modal-actions-grid">
      <view class="modal-grid-btn generate-modal-grid-btn" bindtap="onGenerateLinkModal">{{currentTemplate.hasGenerated ? '获取新链接' : '生成链接'}}</view>
      <view class="modal-grid-btn copy-modal-grid-btn {{currentTemplate.isCopied ? 'copied' : ''}}" bindtap="onCopyLinkModal">{{currentTemplate.isCopied ? '已复制' : '复制链接'}}</view>
      <view class="modal-grid-btn edit-modal-grid-btn" bindtap="onEditTemplate">{{isEditing ? '保存修改' : '立即修改'}}</view>
      <view class="modal-grid-btn delete-modal-grid-btn" bindtap="onDeleteTemplate">删除模板</view>
    </view>
    <!-- 编辑区 -->
    <view class="edit-section" wx:if="{{isEditing}}">
      <view class="edit-item">
        <text class="edit-label">订单介绍</text>
        <textarea class="edit-input intro-edit" value="{{editJieshao}}" maxlength="100" placeholder="请输入订单介绍（100字以内）" bindinput="onEditJieshaoInput" auto-height/>
        <text class="word-count">{{editJieshao.length}}/100</text>
      </view>
      <view class="edit-item">
        <text class="edit-label">价格（元）</text>
        <input class="edit-input price-edit" type="digit" value="{{editJiage}}" placeholder="0.1 - 10000" bindinput="onEditJiageInput"/>
      </view>
      <view class="edit-item">
        <text class="edit-label">标签</text>
        <picker mode="selector" range="{{currentTypeChenghaoList}}" range-key="mingcheng" bindchange="onEditLabelChange">
          <view class="picker-view"><text>{{editLabelName || '无'}}</text></view>
        </picker>
      </view>
      <view class="edit-item commission-item">
        <text class="edit-label">佣金要求（建议≤50）</text>
        <switch checked="{{editCommissionEnabled}}" bindchange="onEditCommissionToggle"/>
        <input wx:if="{{editCommissionEnabled}}" class="commission-input" type="digit" placeholder="佣金金额" value="{{editCommissionValue}}" bindinput="onEditCommissionValueInput"/>
      </view>
    </view>
  </view>
</view>

<!-- 添加模板弹窗 -->
<view class="modal-overlay" wx:if="{{showAddModal}}" bindtap="hideAddModal">
  <view class="modal-content add-modal" catchtap="stopPropagation">
    <view class="modal-close" bindtap="hideAddModal">×</view>
    <view class="modal-header"><text class="modal-title">添加模板</text></view>
    <view class="add-form">
      <view class="form-item">
        <text class="form-label">订单介绍</text>
        <textarea class="form-input intro-input" value="{{addJieshao}}" maxlength="100" placeholder="请输入订单介绍（必填）" bindinput="onAddJieshaoInput" auto-height/>
        <text class="word-count">{{addJieshao.length}}/100</text>
      </view>
      <view class="form-item">
        <text class="form-label">价格（元）</text>
        <input class="form-input price-input" type="digit" value="{{addJiage}}" placeholder="0.1 - 10000" bindinput="onAddJiageInput"/>
      </view>
      <view class="form-item">
        <text class="form-label">标签</text>
        <picker mode="selector" range="{{currentTypeChenghaoList}}" range-key="mingcheng" bindchange="onAddLabelChange">
          <view class="picker-view"><text>{{addLabelName || '可选'}}</text></view>
        </picker>
      </view>
      <view class="form-item commission-item">
        <text class="form-label">佣金要求（建议≤50）</text>
        <switch checked="{{addCommissionEnabled}}" bindchange="onAddCommissionToggle"/>
        <input wx:if="{{addCommissionEnabled}}" class="commission-input" type="digit" placeholder="佣金金额" value="{{addCommissionValue}}" bindinput="onAddCommissionValueInput"/>
      </view>
    </view>
    <view class="modal-actions-grid add-actions-grid">
      <view class="modal-grid-btn cancel-grid-btn" bindtap="hideAddModal">取消</view>
      <view class="modal-grid-btn confirm-add-grid-btn" bindtap="onAddTemplate">确认添加</view>
    </view>
  </view>
</view>

<!-- 删除确认弹窗 -->
<view class="modal-overlay confirm-overlay" wx:if="{{showDeleteConfirm}}" bindtap="hideDeleteConfirm">
  <view class="confirm-content" catchtap="stopPropagation">
    <text class="confirm-title">确认删除</text>
    <text class="confirm-text">确定要删除这个模板吗？此操作不可恢复。</text>
    <view class="confirm-actions-grid">
      <view class="confirm-grid-btn cancel-confirm-grid-btn" bindtap="hideDeleteConfirm">取消</view>
      <view class="confirm-grid-btn delete-confirm-grid-btn" bindtap="confirmDeleteTemplate">确定删除</view>
    </view>
  </view>
</view>

<!-- 获取新链接确认弹窗 -->
<view class="modal-overlay confirm-overlay" wx:if="{{showNewLinkConfirm}}" bindtap="hideNewLinkConfirm">
  <view class="confirm-content" catchtap="stopPropagation">
    <text class="confirm-title">获取新链接</text>
    <text class="confirm-text">{{currentTemplate.isCopied ? '确定要获取新链接吗？旧链接将失效。' : '您还没有复制当前链接，确定要获取新链接吗？'}}</text>
    <view class="confirm-actions-grid">
      <view class="confirm-grid-btn cancel-confirm-grid-btn" bindtap="hideNewLinkConfirm">取消</view>
      <view class="confirm-grid-btn confirm-new-link-grid-btn" bindtap="confirmNewLink">确定</view>
    </view>
  </view>
</view>

<global-notification id="global-notification" />