<template>
  <view class="admin-page">
    <view class="admin-card header-card">
      <view class="breadcrumb">
        <text class="back">返回</text>
        <text class="sep">/</text>
        <text class="current">无效关键词回复</text>
      </view>
    </view>
    
    <view class="admin-card content-card reply-editor-wrap">
      <view class="phone-preview">
        <view class="phone-header">
          <text class="time">9:36</text>
        </view>
        <view class="phone-body">
          <view class="chat-item">
            <view class="avatar">🐷</view>
            <view class="bubble empty"></view>
          </view>
        </view>
      </view>
      
      <view class="reply-form">
        <view class="form-item">
          <text class="label">消息状态：</text>
          <radio-group class="radio-group">
            <label><radio value="1" />启用</label>
            <label><radio value="0" checked />禁用</label>
          </radio-group>
        </view>
        
        <view class="form-item">
          <text class="label">消息类型：</text>
          <view class="filter-select">
            <text class="select-placeholder">请选择规则状态</text>
            <text class="arrow">▼</text>
          </view>
        </view>
        
        <view class="form-btns">
          <button class="btn primary">保存并发布</button>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="uts">
// 无效关键词回复逻辑
</script>

<style scoped>
.bubble.empty {
  width: 40px;
  height: 40px;
  background-color: #fff;
}

.select-placeholder {
  color: #c0c4cc;
}
</style>
