html/client-web
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
ouyangxq
2026-09-20 20:53:23 +08:00
parent e89b9d3722
commit dd7306c7fc
3 changed files with 8 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/modules/first-leg/views/FirstLegOrderCreateHubView.vue
+1 -5
View File
@@ -23,10 +23,6 @@ function selectMode(mode: 'standard' | 'quick') {
<template>
<section class="first-leg-create-hub">
<header class="create-hub-heading">
<h1>头程下单</h1>
<p>填写货物信息，创建新的头程运输订单</p>
</header>
<nav v-if="canQuickOrder" class="order-mode-switch" aria-label="头程下单方式">
<button type="button" :class="{ active: activeMode === 'standard' }" :aria-current="activeMode === 'standard' ? 'page' : undefined" @click="selectMode('standard')"><FilePenLine :size="18" />普通下单</button>
<button type="button" :class="{ active: activeMode === 'quick' }" :aria-current="activeMode === 'quick' ? 'page' : undefined" @click="selectMode('quick')"><Zap :size="18" />快速下单</button>
@@ -37,5 +33,5 @@ function selectMode(mode: 'standard' | 'quick') {
</template>
<style scoped>
.first-leg-create-hub{display:grid;min-width:0;gap:14px}.create-hub-heading{display:grid;gap:5px}.create-hub-heading h1{margin:0;color:var(--navy);font-size:24px;line-height:1.25}.create-hub-heading p{margin:0;color:var(--muted);font-size:13px}.order-mode-switch{display:inline-flex;width:max-content;padding:4px;border:1px solid #d9e2ec;border-radius:8px;background:#f4f7fa}.order-mode-switch button{display:inline-flex;height:38px;align-items:center;gap:8px;padding:0 20px;border:0;border-radius:6px;background:transparent;color:#607087;font:inherit;font-size:13px;font-weight:650;cursor:pointer}.order-mode-switch button.active{background:var(--primary);color:#fff;box-shadow:0 2px 6px rgba(23,107,135,.2)}.order-mode-switch button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.first-leg-create-hub{display:grid;min-width:0;gap:14px}.order-mode-switch{display:inline-flex;width:max-content;padding:4px;border:1px solid #d9e2ec;border-radius:8px;background:#f4f7fa}.order-mode-switch button{display:inline-flex;height:38px;align-items:center;gap:8px;padding:0 20px;border:0;border-radius:6px;background:transparent;color:#607087;font:inherit;font-size:13px;font-weight:650;cursor:pointer}.order-mode-switch button.active{background:var(--primary);color:#fff;box-shadow:0 2px 6px rgba(23,107,135,.2)}.order-mode-switch button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
</style>