8 changed files with 675 additions and 329 deletions
File diff suppressed because it is too large
@ -0,0 +1,244 @@ |
|||
<template> |
|||
<span class="menu-glyph" aria-hidden="true"> |
|||
<svg |
|||
viewBox="0 0 24 24" |
|||
fill="none" |
|||
xmlns="http://www.w3.org/2000/svg" |
|||
class="menu-glyph-svg" |
|||
> |
|||
<g |
|||
stroke="currentColor" |
|||
stroke-width="1.25" |
|||
stroke-linecap="round" |
|||
stroke-linejoin="round" |
|||
> |
|||
<!-- 删除：线框方樽式垃圾桶 --> |
|||
<g v-if="name === 'trash'"> |
|||
<path d="M10 5V4a1 1 0 011-1h2a1 1 0 011 1v1" /> |
|||
<path d="M5 7h14" /> |
|||
<path d="M8 7l1 13h6l1-13" /> |
|||
<path d="M10 11v6M14 11v6" /> |
|||
</g> |
|||
<!-- 复制 --> |
|||
<g v-else-if="name === 'copy'"> |
|||
<rect x="8" y="8" width="11" height="11" rx="1.5" /> |
|||
<path d="M5 16V5a2 2 0 012-2h9" /> |
|||
</g> |
|||
<!-- 切换选择 --> |
|||
<g v-else-if="name === 'switch'"> |
|||
<path d="M5 9a7 7 0 0113-3" /> |
|||
<path d="M5 9h4V5M19 15a7 7 0 01-13 3" /> |
|||
<path d="M19 15h-4v4" /> |
|||
</g> |
|||
<!-- 文档编辑 / 命名 --> |
|||
<g v-else-if="name === 'editDoc'"> |
|||
<path d="M14 3h5v5" /> |
|||
<path d="M4 20V13l9-9 5 5-9 9H4z" /> |
|||
<path d="M12 6l6 6" /> |
|||
</g> |
|||
<!-- 航点编辑（罗盘+定位感） --> |
|||
<g v-else-if="name === 'waypoint'"> |
|||
<circle cx="12" cy="11" r="3" /> |
|||
<path d="M12 14v6M9 20h6" /> |
|||
</g> |
|||
<!-- 速度表意：简易仪表弧 --> |
|||
<g v-else-if="name === 'speed'"> |
|||
<path d="M5 18a7 7 0 0114 0" /> |
|||
<path d="M12 13v5" /> |
|||
<circle cx="12" cy="18" r="1" fill="currentColor" stroke="none" /> |
|||
</g> |
|||
<!-- 向前：带柄箭头 --> |
|||
<g v-else-if="name === 'arrowLeft'"> |
|||
<path d="m15 6-6 6 6 6M21 12H4" /> |
|||
</g> |
|||
<!-- 向后 --> |
|||
<g v-else-if="name === 'arrowRight'"> |
|||
<path d="m9 6 6 6-6 6M3 12h17" /> |
|||
</g> |
|||
<!-- 循环 / 盘旋切换 --> |
|||
<g v-else-if="name === 'refresh'"> |
|||
<path d="M21 12a9 9 0 01-9 9 5 5 0 01-5-5" /> |
|||
<path d="M3 12a9 9 0 019-9 4 4 0 014 4" /> |
|||
<path d="M3 7v5h5M21 17v-5h-5" /> |
|||
</g> |
|||
<!-- 上锁 --> |
|||
<g v-else-if="name === 'lock'"> |
|||
<rect x="6" y="10" width="12" height="10" rx="1.5" /> |
|||
<path d="M8 10V7a4 4 0 018 0v3" /> |
|||
</g> |
|||
<!-- 解锁 --> |
|||
<g v-else-if="name === 'unlock'"> |
|||
<rect x="6" y="10" width="12" height="10" rx="1.5" /> |
|||
<path d="M8 10V7a4 4 0 017-2" /> |
|||
</g> |
|||
<!-- 拆分 --> |
|||
<g v-else-if="name === 'scissors'"> |
|||
<circle cx="8" cy="8" r="2" /> |
|||
<circle cx="8" cy="16" r="2" /> |
|||
<path d="m14 6-6 6M14 18l-6-6" /> |
|||
</g> |
|||
<!-- 拆分复制：双文档 --> |
|||
<g v-else-if="name === 'docDuplicate'"> |
|||
<path d="M8 4h8l2 2v12H8V4z" /> |
|||
<path d="M6 8h8v12H6V8z" /> |
|||
</g> |
|||
<!-- 播放 / 推演 --> |
|||
<g v-else-if="name === 'play'"> |
|||
<path d="M9 7.5v9L18 12 9 7.5z" /> |
|||
</g> |
|||
<!-- 标牌 --> |
|||
<g v-else-if="name === 'tag'"> |
|||
<path d="M3 5a2 2 0 012-2h6l10 10-7 7-9-9V5z" /> |
|||
<circle cx="8.5" cy="7.5" r="1" fill="currentColor" stroke="none" /> |
|||
</g> |
|||
<!-- 铅笔（通用编辑） --> |
|||
<g v-else-if="name === 'pencil'"> |
|||
<path d="M12 20h9" /> |
|||
<path d="m16.5 3.5 4.5 4.5L8 21H3v-5L16.5 3.5z" /> |
|||
</g> |
|||
<!-- 探测：扇形波束 --> |
|||
<g v-else-if="name === 'radar'"> |
|||
<path d="M12 21c-4 0-7-3-7-7s3-7 7-7" /> |
|||
<path d="M12 21V11" /> |
|||
<path d="M12 11 6.5 6.5" /> |
|||
<path d="M12 11 17.5 6.5" /> |
|||
</g> |
|||
<!-- 威力：同心圆靶 --> |
|||
<g v-else-if="name === 'target'"> |
|||
<circle cx="12" cy="12" r="8" /> |
|||
<circle cx="12" cy="12" r="4.5" /> |
|||
<circle cx="12" cy="12" r="1.5" fill="currentColor" stroke="none" /> |
|||
</g> |
|||
<!-- 显示 --> |
|||
<g v-else-if="name === 'eye'"> |
|||
<path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z" /> |
|||
<circle cx="12" cy="12" r="3" /> |
|||
</g> |
|||
<!-- 隐藏 --> |
|||
<g v-else-if="name === 'eyeOff'"> |
|||
<path d="M3 3l18 18" /> |
|||
<path d="M10.6 10.6A3 3 0 0012 15a3 3 0 002.4-5.4" /> |
|||
<path d="M9.9 5.1A10 10 0 0117.7 5c2.5 1 4.3 2.7 5.3 4M6.3 6.3C4.5 7.5 3 9.3 2 12c1.5 4 5.5 7 10 7 1.7 0 3.4-.4 4.9-1" /> |
|||
</g> |
|||
<!-- 导弹：简易三角体 --> |
|||
<g v-else-if="name === 'missile'"> |
|||
<path d="M12 3l2 3H10l2-3z" /> |
|||
<path d="M10 6h4l-1 10H11L10 6z" /> |
|||
<path d="M9 16l-2 3M15 16l2 3" /> |
|||
</g> |
|||
<!-- 填充：几何分层方块 --> |
|||
<g v-else-if="name === 'fill'"> |
|||
<rect x="5" y="5" width="10" height="10" rx="1" /> |
|||
<path d="M5 14h10M5 11h10" /> |
|||
<path d="M8 5v10" /> |
|||
</g> |
|||
<!-- 线宽 / 标尺 --> |
|||
<g v-else-if="name === 'ruler'"> |
|||
<path d="M4 16h16" /> |
|||
<path d="M6 16V12M10 16v-6M14 16v-4M18 16v-8" /> |
|||
</g> |
|||
<!-- 方位 --> |
|||
<g v-else-if="name === 'compass'"> |
|||
<circle cx="12" cy="12" r="8" /> |
|||
<path d="m12 8 2 4-2 6-2-6 2-4z" /> |
|||
</g> |
|||
<!-- 透明度 / 蒙版意象：画框+渐隐线 --> |
|||
<g v-else-if="name === 'opacity'"> |
|||
<rect x="4" y="5" width="16" height="14" rx="1.5" /> |
|||
<path d="M7 18c2-3 4-7 8-10" /> |
|||
<path d="M7 14c2-2 4-5 7-7" /> |
|||
</g> |
|||
<!-- 边框色：双框 --> |
|||
<g v-else-if="name === 'border'"> |
|||
<rect x="5" y="5" width="14" height="14" rx="2" /> |
|||
<rect x="8.5" y="8.5" width="7" height="7" rx="1" /> |
|||
</g> |
|||
<!-- 字号 T --> |
|||
<g v-else-if="name === 'type'"> |
|||
<path d="M9 5h6M12 5v12" /> |
|||
<path d="M8 17h8" /> |
|||
</g> |
|||
<!-- 位置：地理锚点（十字+圆） --> |
|||
<g v-else-if="name === 'anchor'"> |
|||
<circle cx="12" cy="12" r="3" /> |
|||
<path d="M12 3v4M12 17v4M3 12h4M17 12h4" /> |
|||
</g> |
|||
<!-- 伸缩框 --> |
|||
<g v-else-if="name === 'transform'"> |
|||
<path d="M4 8V4h4M16 4h4v4M20 16v4h-4M8 20H4v-4" /> |
|||
</g> |
|||
<!-- 圆点大小 --> |
|||
<g v-else-if="name === 'dot'"> |
|||
<circle cx="12" cy="12" r="3" /> |
|||
<circle cx="12" cy="12" r="7" /> |
|||
</g> |
|||
<!-- 展开箭头 --> |
|||
<g v-else-if="name === 'chevronDown'"> |
|||
<path d="m6 9 6 6 6-6" /> |
|||
</g> |
|||
<g v-else-if="name === 'chevronRight'"> |
|||
<path d="m9 6 6 6-6 6" /> |
|||
</g> |
|||
<!-- 子项引导 --> |
|||
<g v-else-if="name === 'subDot'"> |
|||
<circle cx="12" cy="12" r="1.5" fill="currentColor" stroke="none" /> |
|||
</g> |
|||
<!-- 色板 / 图标色（滴状几何） --> |
|||
<g v-else-if="name === 'droplet'"> |
|||
<path d="M12 21a5 5 0 005-5c0-3-5-9-5-9S7 13 7 16a5 5 0 005 5z" /> |
|||
</g> |
|||
<!-- 颜色与大小：滑杆+方块 --> |
|||
<g v-else-if="name === 'style'"> |
|||
<rect x="5" y="6" width="6" height="6" rx="1" /> |
|||
<path d="M15 8.5h4M15 12h4M15 15.5h4" /> |
|||
</g> |
|||
<!-- 默认占位 --> |
|||
<circle v-else cx="12" cy="12" r="4" /> |
|||
</g> |
|||
</svg> |
|||
</span> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'MenuGlyph', |
|||
props: { |
|||
name: { |
|||
type: String, |
|||
required: true |
|||
}, |
|||
small: { |
|||
type: Boolean, |
|||
default: false |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.menu-glyph { |
|||
display: inline-flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
flex-shrink: 0; |
|||
width: 18px; |
|||
height: 18px; |
|||
margin-right: 10px; |
|||
color: inherit; |
|||
vertical-align: middle; |
|||
} |
|||
.menu-glyph.is-small { |
|||
width: 14px; |
|||
height: 14px; |
|||
margin-right: 8px; |
|||
} |
|||
.menu-glyph-svg { |
|||
width: 18px; |
|||
height: 18px; |
|||
display: block; |
|||
} |
|||
.menu-glyph.is-small .menu-glyph-svg { |
|||
width: 14px; |
|||
height: 14px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue