配队模拟器：修订间差异

来自卡厄思梦境WIKI

←上一编辑下一编辑→
律Rhyme​（留言 | 贡献）
行政员、​界面管理员、​管理员
3,949次编辑
无编辑摘要
律Rhyme​（留言 | 贡献）
行政员、​界面管理员、​管理员
3,949次编辑
无编辑摘要
第1行： 第1行：
{{ResourceLoader|TeamBuilder.js}}
<div style="display: flex; gap: 20px; padding: 20px; background-color: #1a1a1a; color: white; font-family: sans-serif;">
<div id="team-builder" style="display: flex; gap: 20px; padding: 20px; background: #2a2a2a; border-radius: 8px;">
 
 
<!-- 左侧区域 -->
  <!-- 左侧区域 -->
<div style="flex: 0 0 300px; display: flex; flex-direction: column; gap: 15px;">
  <div style="display: flex; flex-direction: column; gap: 15px;">
 
    <!-- 战斗员选择区 -->
<!-- 战斗员选择框 -->
    <div id="character-slot" class="character-slot" style="width: 260px; height: 460px; background: #3a3a3a; border-radius: 4px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; overflow: hidden;">
<div id="character-box" style="width: 260px; height: 460px; border-radius: 4px; background-color: #333; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center; overflow: hidden;">
      <span style="color: #888; font-size: 48px;">+</span>
    <span style="font-size: 60px; color: #aaa;">+</span>
    <div id="selected-character" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none; background-color: #222;">
        <!-- 角色立绘将插入此处 -->
     </div>
     </div>
   
</div>
    <!-- 伙伴选择区 -->
 
    <div id="partner-slot" class="partner-slot" style="width: 150px; height: 77px; background: #3a3a3a; border-radius: 4px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; overflow: hidden;">
<!-- 伙伴选择框 -->
      <span style="color: #888; font-size: 24px;">+</span>
<div id="partner-box" style="width: 150px; height: 77px; border-radius: 4px; background-color: #333; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center; overflow: hidden;">
    <span style="font-size: 40px; color: #aaa;">+</span>
    <div id="selected-partner" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none; background-color: #222;">
        <!-- 伙伴头像将插入此处 -->
    </div>
</div>
 
</div>
 
<!-- 中部区域 - 卡牌区 -->
<div style="flex: 1; display: flex; flex-direction: column; gap: 15px;">
    <div id="card-deck-box" style="height: 600px; border: 2px dashed #555; border-radius: 8px; display: flex; flex-wrap: wrap; gap: 10px; padding: 15px; background-color: #2a2a2a; overflow-y: auto;">
        <div style="width: 100%; text-align: center; color: #aaa; font-size: 24px; margin-top: 100px;">点击中间“+”号添加卡牌</div>
     </div>
     </div>
  </div>
 
 
     <div id="add-card-button" style="width: 100%; height: 80px; border-radius: 8px; background-color: #444; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 48px; color: #aaa;">
  <!-- 中部卡牌区 -->
        +
  <div style="flex: 1; display: flex; flex-direction: column; gap: 15px;">
     <div id="deck-area" class="deck-area" style="min-height: 500px; background: #3a3a3a; border-radius: 4px; padding: 20px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative;">
      <span style="color: #888; font-size: 48px;">+</span>
      <div id="deck-cards" style="display: none; flex-wrap: wrap; gap: 10px; width: 100%;"></div>
     </div>
     </div>
  </div>
 
 
    <!-- 卡牌选择弹窗（默认隐藏） -->
  <!-- 右侧装备区 -->
    <div id="card-selection-modal" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); z-index: 9999; overflow-y: auto; padding: 20px;">
  <div style="display: flex; flex-direction: column; gap: 15px;">
        <div style="position: absolute; top: 20px; right: 20px; color: white; font-size: 24px; cursor: pointer;" onclick="document.getElementById('card-selection-modal').style.display='none'">×</div>
    <div id="weapon-slot" class="equip-slot" data-type="武器" style="width: 124px; height: 124px; background: #3a3a3a; border-radius: 4px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; overflow: hidden;">
        <div style="margin: 0 auto; max-width: 1200px; background-color: #222; padding: 20px; border-radius: 10px;">
      <span style="color: #888; font-size: 32px;">+</span>
            <h2 style="color: white; text-align: center;">选择角色卡牌</h2>
            <div id="card-list" style="display: flex; flex-wrap: wrap; gap: 15px; justify-content: center;">
                <!-- 动态加载卡牌 -->
            </div>
        </div>
     </div>
     </div>
    <div id="armor-slot" class="equip-slot" data-type="装甲" style="width: 124px; height: 124px; background: #3a3a3a; border-radius: 4px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; overflow: hidden;">
</div>
      <span style="color: #888; font-size: 32px;">+</span>
 
<!-- 右侧区域 - 装备区 -->
<div style="flex: 0 0 140px; display: flex; flex-direction: column; gap: 15px;">
 
<!-- 武器选择 -->
<div id="weapon-box" class="equipment-slot" data-type="武器" style="width: 124px; height: 124px; border-radius: 4px; background-color: #333; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center; overflow: hidden;">
    <span style="font-size: 40px; color: #aaa;">+</span>
    <div class="selected-equipment" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none;">
        <!-- 装备图片插入处 -->
     </div>
     </div>
    <div id="ring-slot" class="equip-slot" data-type="戒指" style="width: 124px; height: 124px; background: #3a3a3a; border-radius: 4px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; overflow: hidden;">
</div>
      <span style="color: #888; font-size: 32px;">+</span>
 
<!-- 装甲选择 -->
<div id="armor-box" class="equipment-slot" data-type="装甲" style="width: 124px; height: 124px; border-radius: 4px; background-color: #333; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center; overflow: hidden;">
    <span style="font-size: 40px; color: #aaa;">+</span>
    <div class="selected-equipment" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none;">
        <!-- 装备图片插入处 -->
     </div>
     </div>
  </div>
 
</div>
</div>


<!-- 选择战斗员模态框 -->
<!-- 戒指选择 -->
<div id="character-modal" class="tb-modal" style="display: none;">
<div id="ring-box" class="equipment-slot" data-type="戒指" style="width: 124px; height: 124px; border-radius: 4px; background-color: #333; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center; overflow: hidden;">
  <div class="tb-modal-content" style="max-width: 90vw; max-height: 90vh; overflow: auto; background: #2a2a2a; padding: 20px; border-radius: 8px; position: relative;">
     <span style="font-size: 40px; color: #aaa;">+</span>
     <div class="tb-modal-close" style="position: absolute; top: 10px; right: 20px; cursor: pointer; font-size: 32px; color: white; z-index: 1001;">×</div>
     <div class="selected-equipment" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none;">
     <h3 style="color: white; margin-bottom: 20px;">选择战斗员</h3>
        <!-- 装备图片插入处 -->
    <div id="character-list">
      {{#ask:[[分类:战斗员]]
      |?名称
      |?稀有度
      |?职业
      |?属性
      |sort=实装日期,稀有度,id
      |order=desc,desc,desc
      |mainlabel=-
      |link=none
      |template=配队/战斗员
      |headers=hide
      |format=template
      |limit=1000
      }}
     </div>
     </div>
  </div>
</div>
</div>


<!-- 选择伙伴模态框 -->
<!-- 装备选择弹窗（默认隐藏） -->
<div id="partner-modal" class="tb-modal" style="display: none;">
<div id="equipment-modal" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); z-index: 9999; overflow-y: auto; padding: 20px;">
  <div class="tb-modal-content" style="max-width: 90vw; max-height: 90vh; overflow: auto; background: #2a2a2a; padding: 20px; border-radius: 8px; position: relative;">
     <div style="position: absolute; top: 20px; right: 20px; color: white; font-size: 24px; cursor: pointer;" onclick="document.getElementById('equipment-modal').style.display='none'">×</div>
     <div class="tb-modal-close" style="position: absolute; top: 10px; right: 20px; cursor: pointer; font-size: 32px; color: white; z-index: 1001;">×</div>
     <div style="margin: 0 auto; max-width: 1200px; background-color: #222; padding: 20px; border-radius: 10px;">
     <h3 style="color: white; margin-bottom: 20px;">选择伙伴</h3>
        <h2 style="color: white; text-align: center;" id="equipment-title">选择装备</h2>
    <div id="partner-list">
        <div id="equipment-list" style="display: flex; flex-wrap: wrap; gap: 15px; justify-content: center;">
      {{#ask:[[分类:伙伴]]
            <!-- 由JS动态填充 -->
      |?名称
        </div>
      |?稀有度
      |?职业
      |?属性
      |?id
      |sort=实装日期,稀有度,id
      |order=desc,desc,desc
      |mainlabel=-
      |link=none
      |template=配队/伙伴
      |headers=hide
      |format=template
      |limit=1000
      }}
     </div>
     </div>
  </div>
</div>
</div>


<!-- 选择卡牌模态框 -->
<div id="card-modal" class="tb-modal" style="display: none;">
  <div class="tb-modal-content" style="max-width: 90vw; max-height: 90vh; overflow: auto; background: #2a2a2a; padding: 20px; border-radius: 8px; position: relative;">
    <div class="tb-modal-close" style="position: absolute; top: 10px; right: 20px; cursor: pointer; font-size: 32px; color: white; z-index: 1001;">×</div>
    <h3 style="color: white; margin-bottom: 20px;">选择卡牌</h3>
    <div id="available-cards-list" style="display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;"></div>
  </div>
</div>
</div>


<!-- 选择装备模态框 -->
</div>
<div id="equipment-modal" class="tb-modal" style="display: none;">
 
  <div class="tb-modal-content" style="max-width: 90vw; max-height: 90vh; overflow: auto; background: #2a2a2a; padding: 20px; border-radius: 8px; position: relative;">
<!-- 加载卡牌数据和装备数据的隐藏区域 -->
    <div class="tb-modal-close" style="position: absolute; top: 10px; right: 20px; cursor: pointer; font-size: 32px; color: white; z-index: 1001;">×</div>
<div style="display: none;" id="hidden-data-container">
    <h3 id="equipment-modal-title" style="color: white; margin-bottom: 20px;">选择装备</h3>
     <!-- 我们将用JS获取这些模板渲染后的内容 -->
     <div id="equipment-list" style="display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;"></div>
  </div>
</div>
</div>

2025年10月18日 (六) 20:02的版本

   +

   +
点击中间“+”号添加卡牌
       +

   +

   +

   +
检索自“http://cznwiki.com/index.php?title=配队模拟器&oldid=3404”