zzh
b5edbb8447
新增石米等淡色背景预设并设为默认，修复页面配置抽屉偶发不弹出问题，移除登录欢迎卡；同步 IDE 官网导航与背景样式，并扩展管理端工作台统计展示。 Co-authored-by: Cursor <cursoragent@cursor.com>
738 lines
18 KiB
Vue
738 lines
18 KiB
Vue
<template>
|
||
<a-modal
|
||
:visible="visible"
|
||
title="9610 跨境电商出口方案选择指南"
|
||
:width="960"
|
||
:footer="false"
|
||
unmount-on-close
|
||
class="export-customs-guide-modal"
|
||
@cancel="handleClose"
|
||
@update:visible="(val: boolean) => emit('update:visible', val)"
|
||
>
|
||
<div class="guide-scroll">
|
||
<div class="guide-container">
|
||
<div class="guide-header">
|
||
<p class="guide-subtitle">3 分钟找到最适合你的报关与税务方案</p>
|
||
</div>
|
||
|
||
<div class="section-title">一、方案选择决策树</div>
|
||
<div class="decision-tree">
|
||
<div class="q-card">
|
||
<div class="step-tag">第 1 步</div>
|
||
<div class="step-text">你的货物能取得增值税专用发票（进项票）吗？</div>
|
||
</div>
|
||
|
||
<div class="connector" />
|
||
|
||
<div class="split">
|
||
<div class="branch">
|
||
<div class="option-label yes">✓ 能取得专票</div>
|
||
<div class="sol-card refund">
|
||
<div class="sol-head">
|
||
<span class="sol-title">出口退税（免抵退）</span>
|
||
<span class="sol-badge">利润最优</span>
|
||
</div>
|
||
<ul class="sol-list">
|
||
<li>报关方式：汇总申报（正式报关单）</li>
|
||
<li>HS 编码：完整 10 位申报</li>
|
||
<li>核心凭证：报关单退税联 + 进项专票</li>
|
||
<li>操作平台：单一窗口 + 电子税务局</li>
|
||
<li>申报频率：每月汇总 + 退税申报</li>
|
||
</ul>
|
||
<div class="sol-result">→ 进项税额按退税率退还，真金白银到账</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="branch">
|
||
<div class="option-label no">✗ 无法取得专票</div>
|
||
<div class="sub-flow">
|
||
<div class="q-card sub">
|
||
<div class="step-tag">第 2 步</div>
|
||
<div class="step-text">是否希望享受出口免税政策？</div>
|
||
</div>
|
||
<div class="connector short" />
|
||
<div class="split">
|
||
<div class="branch">
|
||
<div class="option-label yes">✓ 希望免税</div>
|
||
<div class="sol-card exempt">
|
||
<div class="sol-head">
|
||
<span class="sol-title">无票免征</span>
|
||
<span class="sol-badge">合规推荐</span>
|
||
</div>
|
||
<ul class="sol-list">
|
||
<li>报关方式：简易 / 汇总均可</li>
|
||
<li>HS 编码：前 4 位即可</li>
|
||
<li>核心凭证：综服平台免税登记记录</li>
|
||
<li>操作平台：单一窗口 + 综服平台</li>
|
||
<li>申报频率：每批货预约登记</li>
|
||
</ul>
|
||
<div class="sol-result">→ 出口环节增值税/消费税免征，合规无忧</div>
|
||
</div>
|
||
</div>
|
||
<div class="branch">
|
||
<div class="option-label neutral">✗ 仅需出货</div>
|
||
<div class="sol-card basic">
|
||
<div class="sol-head">
|
||
<span class="sol-title">基础通关服务</span>
|
||
<span class="sol-badge">快捷出货</span>
|
||
</div>
|
||
<ul class="sol-list">
|
||
<li>报关方式：物流商统一简易申报</li>
|
||
<li>HS 编码：前 4 位批量申报</li>
|
||
<li>核心凭证：物流轨迹 + 出境证明</li>
|
||
<li>操作平台：物流商统一操作</li>
|
||
<li>申报频率：物流商统一处理</li>
|
||
</ul>
|
||
<div class="sol-result">→ 货物快速合规出境，操作最简</div>
|
||
<div class="sol-tip">
|
||
<strong>⚠ 风险提示：</strong>基础通关模式下，如企业未规范处理税务，可能被视同内销征税（<strong>13% 增值税 + 25% 企业所得税 + 滞纳金 + 罚款</strong>）。建议业务量增长后及时升级为无票免征或退税方案。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-title">二、三种方案核心对比</div>
|
||
<div class="compare-wrap">
|
||
<table class="compare-table">
|
||
<thead>
|
||
<tr>
|
||
<th>对比项</th>
|
||
<th class="col-refund">出口退税</th>
|
||
<th class="col-exempt">无票免征</th>
|
||
<th class="col-basic">基础通关</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr v-for="row in compareRows" :key="row.label">
|
||
<td>{{ row.label }}</td>
|
||
<td class="col-refund">{{ row.refund }}</td>
|
||
<td class="col-exempt">{{ row.exempt }}</td>
|
||
<td class="col-basic">{{ row.basic }}</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div class="section-title">三、出口主体模式（单抬头 vs 双抬头）</div>
|
||
<div class="mode-grid">
|
||
<div class="mode-card single">
|
||
<h4>自主出口（单抬头）</h4>
|
||
<div class="mode-sub">境内发货人 = 生产销售单位 = 电商企业自己</div>
|
||
<div v-for="field in singleModeFields" :key="field.label" class="mode-field">
|
||
<span class="label">{{ field.label }}</span>
|
||
<span class="value">{{ field.value }}</span>
|
||
</div>
|
||
<div class="mode-result">
|
||
<strong>适用：有海关备案、要积累出口数据的中大型卖家</strong>
|
||
全流程自己把控，出口数据归企业自己。
|
||
</div>
|
||
</div>
|
||
<div class="mode-card double">
|
||
<h4>代理出口（双抬头）</h4>
|
||
<div class="mode-sub">境内发货人 = 物流商，生产销售单位 = 电商企业</div>
|
||
<div v-for="field in doubleModeFields" :key="field.label" class="mode-field">
|
||
<span class="label">{{ field.label }}</span>
|
||
<span class="value">{{ field.value }}</span>
|
||
</div>
|
||
<div class="mode-result">
|
||
<strong>适用：无报关团队、希望一站式操作的中小卖家</strong>
|
||
物流商负责报关申报，卖家凭报关单与代理委托协议办理退税。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mode-note">
|
||
<strong>重要提醒：</strong>无论单抬头还是双抬头，<strong>生产销售单位必须是电商企业自己</strong>，才能正常办理退税。
|
||
</div>
|
||
|
||
<div class="section-title">四、重要注意事项</div>
|
||
<div class="notice-box">
|
||
<h4>出口前请务必了解</h4>
|
||
<ul>
|
||
<li v-for="(item, index) in noticeItems" :key="index" v-html="item" />
|
||
</ul>
|
||
</div>
|
||
|
||
<p class="guide-footer">本指南仅供参考，具体操作以海关及税务部门最新规定为准。</p>
|
||
</div>
|
||
</div>
|
||
</a-modal>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
defineOptions({ name: 'ExportCustoms9610GuideModal' })
|
||
|
||
defineProps<{
|
||
visible: boolean
|
||
}>()
|
||
|
||
const emit = defineEmits<{
|
||
'update:visible': [value: boolean]
|
||
}>()
|
||
|
||
function handleClose() {
|
||
emit('update:visible', false)
|
||
}
|
||
|
||
const compareRows = [
|
||
{ label: '进项专票', refund: '必须有', exempt: '不需要', basic: '不需要' },
|
||
{ label: '报关方式', refund: '汇总申报', exempt: '简易 / 汇总均可', basic: '统一简易申报' },
|
||
{ label: 'HS 编码精度', refund: '10 位完整', exempt: '前 4 位即可', basic: '前 4 位批量' },
|
||
{ label: '正式报关单', refund: '有（退税专用联）', exempt: '可有可无', basic: '物流商统一申报' },
|
||
{ label: '综试区要求', refund: '无强制要求', exempt: '需注册在综试区内', basic: '无要求' },
|
||
{ label: '税务效果', refund: '退进项税（到账）', exempt: '免出口增值税', basic: '无税务优惠' },
|
||
{ label: '出口数据', refund: '企业自有', exempt: '企业自有', basic: '物流商统一申报' },
|
||
{ label: '操作复杂度', refund: '较高（需专票匹配）', exempt: '较低（登记即可）', basic: '最低（交货即可）' },
|
||
{ label: '合规等级', refund: '★★★★★', exempt: '★★★★☆', basic: '★★★☆☆' },
|
||
{
|
||
label: '适用卖家',
|
||
refund: '供应链规范、有稳定专票',
|
||
exempt: '1688 采购、想合规免税',
|
||
basic: '起步阶段、货值较低',
|
||
},
|
||
]
|
||
|
||
const singleModeFields = [
|
||
{ label: '境内发货人', value: '电商企业自己' },
|
||
{ label: '生产销售单位', value: '电商企业自己' },
|
||
{ label: '出口数据', value: '算在自己名下' },
|
||
{ label: '退税主体', value: '自己申请退税' },
|
||
{ label: '收汇', value: '自己收汇结汇' },
|
||
]
|
||
|
||
const doubleModeFields = [
|
||
{ label: '境内发货人', value: '物流商（代理方）' },
|
||
{ label: '生产销售单位', value: '电商企业自己' },
|
||
{ label: '出口数据', value: '企业自有（备注关联）' },
|
||
{ label: '退税主体', value: '企业凭代理协议退税' },
|
||
{ label: '收汇', value: '代理代收或企业自收' },
|
||
]
|
||
|
||
const noticeItems = [
|
||
'无票免征<strong>不是自动免税</strong>——需在综服平台完成登记，未登记可能被视同内销征税',
|
||
'出口退税必须走<strong>汇总申报</strong>，简易申报无法生成正式报关单，不能退税',
|
||
'三单数据（订单/支付/物流）必须<strong>一致</strong>，数据不匹配可能导致退税失败',
|
||
'9610 模式单票货值<strong>不超过 5000 元</strong>，超限需转一般贸易报关',
|
||
'货物核放后<strong>48 小时内</strong>需完成离境，离境凭证是退税/免税的关键证明',
|
||
'同一包裹可拆分申报：退税商品走汇总申报，非退税商品走简易申报',
|
||
'退税审核周期一般为<strong>20 个工作日</strong>，首次退税企业可能被函调',
|
||
'无票免征登记需在货物结关后<strong>至少提前 2 个自然日</strong>办理',
|
||
'业务量增长后，建议从基础通关升级为<strong>无票免征或退税方案</strong>，降低税务成本',
|
||
]
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
@guide-accent: var(--app-primary-color, #054f74);
|
||
@guide-accent-soft: color-mix(in srgb, @guide-accent 12%, white);
|
||
@guide-accent-border: color-mix(in srgb, @guide-accent 35%, white);
|
||
|
||
.guide-scroll {
|
||
max-height: calc(85vh - 120px);
|
||
overflow: auto;
|
||
margin: -8px -20px -20px;
|
||
padding: 0 20px 20px;
|
||
}
|
||
|
||
.guide-container {
|
||
max-width: 900px;
|
||
margin: 0 auto;
|
||
color: #2c3e50;
|
||
line-height: 1.7;
|
||
}
|
||
|
||
.guide-header {
|
||
text-align: center;
|
||
margin-bottom: 20px;
|
||
padding-bottom: 16px;
|
||
border-bottom: 1px solid #eef0f3;
|
||
}
|
||
|
||
.guide-subtitle {
|
||
margin: 0;
|
||
font-size: 13px;
|
||
color: #8a94a6;
|
||
}
|
||
|
||
.section-title {
|
||
font-size: 16px;
|
||
font-weight: 600;
|
||
color: #1a2332;
|
||
margin: 28px 0 16px;
|
||
padding-left: 12px;
|
||
border-left: 3px solid @guide-accent;
|
||
}
|
||
|
||
.decision-tree {
|
||
background: linear-gradient(180deg, #f6f8fa 0%, #f9fafb 100%);
|
||
border-radius: 12px;
|
||
padding: 28px 20px 24px;
|
||
}
|
||
|
||
.q-card {
|
||
background: #fff;
|
||
border: 2px solid #e2e6eb;
|
||
border-radius: 10px;
|
||
padding: 16px 24px;
|
||
text-align: center;
|
||
}
|
||
|
||
.q-card.sub {
|
||
padding: 12px 18px;
|
||
border-style: dashed;
|
||
border-color: #d4c8a8;
|
||
background: #fdfaf3;
|
||
}
|
||
|
||
.step-tag {
|
||
display: inline-block;
|
||
font-size: 10px;
|
||
font-weight: 700;
|
||
color: #fff;
|
||
background: @guide-accent;
|
||
padding: 2px 8px;
|
||
border-radius: 3px;
|
||
margin-bottom: 8px;
|
||
letter-spacing: 1px;
|
||
}
|
||
|
||
.q-card.sub .step-tag {
|
||
background: #b07a3a;
|
||
}
|
||
|
||
.step-text {
|
||
font-size: 14.5px;
|
||
font-weight: 600;
|
||
color: #1a2332;
|
||
}
|
||
|
||
.connector {
|
||
display: flex;
|
||
justify-content: center;
|
||
height: 28px;
|
||
position: relative;
|
||
|
||
&::before {
|
||
content: '';
|
||
width: 2px;
|
||
height: 100%;
|
||
background: linear-gradient(180deg, #d0d7de, #c0c8d0);
|
||
}
|
||
|
||
&::after {
|
||
content: '';
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
border-left: 5px solid transparent;
|
||
border-right: 5px solid transparent;
|
||
border-top: 6px solid #c0c8d0;
|
||
}
|
||
|
||
&.short {
|
||
height: 20px;
|
||
}
|
||
}
|
||
|
||
.split {
|
||
display: flex;
|
||
gap: 20px;
|
||
align-items: flex-start;
|
||
}
|
||
|
||
.branch {
|
||
flex: 1;
|
||
min-width: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
}
|
||
|
||
.option-label {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 5px;
|
||
font-size: 12px;
|
||
font-weight: 600;
|
||
padding: 5px 14px;
|
||
border-radius: 20px;
|
||
margin-bottom: 10px;
|
||
white-space: nowrap;
|
||
|
||
&.yes {
|
||
background: @guide-accent-soft;
|
||
color: color-mix(in srgb, @guide-accent 70%, black);
|
||
}
|
||
|
||
&.no {
|
||
background: #faf0e0;
|
||
color: #8a5a20;
|
||
}
|
||
|
||
&.neutral {
|
||
background: #eef0f3;
|
||
color: #5a6472;
|
||
}
|
||
}
|
||
|
||
.sol-card {
|
||
width: 100%;
|
||
border-radius: 10px;
|
||
padding: 18px;
|
||
border: 1.5px solid;
|
||
|
||
&.refund {
|
||
background: linear-gradient(135deg, @guide-accent-soft 0%, #e8f0ea 100%);
|
||
border-color: @guide-accent-border;
|
||
}
|
||
|
||
&.exempt {
|
||
background: linear-gradient(135deg, #fdf6ec 0%, #faf0de 100%);
|
||
border-color: #e0cca0;
|
||
}
|
||
|
||
&.basic {
|
||
background: linear-gradient(135deg, #f3f4f6 0%, #eef0f3 100%);
|
||
border-color: #ccd1d8;
|
||
}
|
||
}
|
||
|
||
.sol-head {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 8px;
|
||
margin-bottom: 12px;
|
||
}
|
||
|
||
.sol-title {
|
||
font-size: 14.5px;
|
||
font-weight: 700;
|
||
}
|
||
|
||
.sol-card.refund .sol-title {
|
||
color: color-mix(in srgb, @guide-accent 70%, black);
|
||
}
|
||
|
||
.sol-card.exempt .sol-title {
|
||
color: #8a5a20;
|
||
}
|
||
|
||
.sol-card.basic .sol-title {
|
||
color: #4a5568;
|
||
}
|
||
|
||
.sol-badge {
|
||
font-size: 10px;
|
||
font-weight: 600;
|
||
padding: 2px 7px;
|
||
border-radius: 3px;
|
||
color: #fff;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.sol-card.refund .sol-badge {
|
||
background: @guide-accent;
|
||
}
|
||
|
||
.sol-card.exempt .sol-badge {
|
||
background: #b07a3a;
|
||
}
|
||
|
||
.sol-card.basic .sol-badge {
|
||
background: #7a8494;
|
||
}
|
||
|
||
.sol-list {
|
||
list-style: none;
|
||
margin: 0 0 12px;
|
||
padding: 0;
|
||
|
||
li {
|
||
font-size: 12px;
|
||
color: #4a5568;
|
||
padding: 2.5px 0 2.5px 16px;
|
||
position: relative;
|
||
line-height: 1.5;
|
||
|
||
&::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: 4px;
|
||
top: 9px;
|
||
width: 5px;
|
||
height: 5px;
|
||
border-radius: 50%;
|
||
background: #7a8494;
|
||
}
|
||
}
|
||
}
|
||
|
||
.sol-card.refund .sol-list li::before {
|
||
background: @guide-accent;
|
||
}
|
||
|
||
.sol-card.exempt .sol-list li::before {
|
||
background: #b07a3a;
|
||
}
|
||
|
||
.sol-result {
|
||
padding-top: 10px;
|
||
border-top: 1px dashed #d0d5dc;
|
||
font-size: 12px;
|
||
font-weight: 600;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.sol-card.refund .sol-result {
|
||
border-color: @guide-accent-border;
|
||
color: color-mix(in srgb, @guide-accent 70%, black);
|
||
}
|
||
|
||
.sol-card.exempt .sol-result {
|
||
border-color: #e0d0a8;
|
||
color: #8a5a20;
|
||
}
|
||
|
||
.sol-tip {
|
||
margin-top: 10px;
|
||
padding: 9px 11px;
|
||
background: #f0f7ff;
|
||
border: 1px solid #c8dcf0;
|
||
border-radius: 6px;
|
||
font-size: 11px;
|
||
color: #3a5a7a;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.sub-flow {
|
||
width: 100%;
|
||
background: #fff;
|
||
border: 1.5px dashed #d8ccb0;
|
||
border-radius: 10px;
|
||
padding: 16px 14px 14px;
|
||
|
||
.split {
|
||
gap: 14px;
|
||
}
|
||
|
||
.sol-card {
|
||
padding: 14px;
|
||
}
|
||
|
||
.option-label {
|
||
font-size: 11px;
|
||
padding: 4px 10px;
|
||
margin-bottom: 8px;
|
||
}
|
||
}
|
||
|
||
.compare-wrap {
|
||
overflow-x: auto;
|
||
}
|
||
|
||
.compare-table {
|
||
width: 100%;
|
||
min-width: 640px;
|
||
border-collapse: collapse;
|
||
font-size: 13px;
|
||
|
||
th,
|
||
td {
|
||
padding: 10px 12px;
|
||
border-bottom: 1px solid #eef0f3;
|
||
text-align: left;
|
||
}
|
||
|
||
th {
|
||
background: #f4f6f8;
|
||
font-weight: 600;
|
||
color: #4a5568;
|
||
border-bottom: 2px solid #e4e8ec;
|
||
}
|
||
|
||
th:first-child {
|
||
width: 20%;
|
||
color: #8a94a6;
|
||
font-weight: 500;
|
||
}
|
||
|
||
tr:last-child td {
|
||
border-bottom: none;
|
||
}
|
||
}
|
||
|
||
.col-refund {
|
||
color: color-mix(in srgb, @guide-accent 70%, black);
|
||
}
|
||
|
||
.col-exempt {
|
||
color: #9a6a2a;
|
||
}
|
||
|
||
.col-basic {
|
||
color: #5a6472;
|
||
}
|
||
|
||
.mode-grid {
|
||
display: flex;
|
||
gap: 20px;
|
||
}
|
||
|
||
.mode-card {
|
||
flex: 1;
|
||
min-width: 0;
|
||
border-radius: 8px;
|
||
padding: 20px;
|
||
border: 1px solid #e4e8ec;
|
||
background: #fafbfc;
|
||
|
||
&.single {
|
||
border-color: @guide-accent-border;
|
||
background: @guide-accent-soft;
|
||
}
|
||
|
||
&.double {
|
||
border-color: #d4c8e0;
|
||
background: #f3f0f7;
|
||
}
|
||
|
||
h4 {
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
margin: 0 0 6px;
|
||
}
|
||
|
||
&.single h4 {
|
||
color: color-mix(in srgb, @guide-accent 70%, black);
|
||
}
|
||
|
||
&.double h4 {
|
||
color: #5a4a7a;
|
||
}
|
||
}
|
||
|
||
.mode-sub {
|
||
font-size: 12px;
|
||
color: #8a94a6;
|
||
margin-bottom: 14px;
|
||
}
|
||
|
||
.mode-field {
|
||
display: flex;
|
||
font-size: 13px;
|
||
padding: 6px 0;
|
||
border-bottom: 1px dashed #e0e4e8;
|
||
|
||
&:last-child {
|
||
border-bottom: none;
|
||
}
|
||
|
||
.label {
|
||
width: 96px;
|
||
color: #8a94a6;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.value {
|
||
color: #4a5568;
|
||
font-weight: 500;
|
||
}
|
||
}
|
||
|
||
.mode-result {
|
||
margin-top: 14px;
|
||
padding-top: 12px;
|
||
border-top: 1px solid #e0e4e8;
|
||
font-size: 13px;
|
||
color: #4a5568;
|
||
|
||
strong {
|
||
display: block;
|
||
margin-bottom: 4px;
|
||
color: #1a2332;
|
||
}
|
||
}
|
||
|
||
.mode-note {
|
||
margin-top: 16px;
|
||
padding: 14px 18px;
|
||
background: #fff8f0;
|
||
border: 1px solid #f0e0c8;
|
||
border-radius: 8px;
|
||
font-size: 13px;
|
||
color: #6b5a42;
|
||
line-height: 1.8;
|
||
|
||
strong {
|
||
color: #9a6a2a;
|
||
}
|
||
}
|
||
|
||
.notice-box {
|
||
background: #fff8f0;
|
||
border: 1px solid #f0e0c8;
|
||
border-radius: 8px;
|
||
padding: 18px 22px;
|
||
|
||
h4 {
|
||
font-size: 14px;
|
||
font-weight: 600;
|
||
color: #9a6a2a;
|
||
margin: 0 0 10px;
|
||
}
|
||
|
||
ul {
|
||
list-style: none;
|
||
margin: 0;
|
||
padding: 0;
|
||
font-size: 13px;
|
||
color: #6b5a42;
|
||
}
|
||
|
||
li {
|
||
padding: 4px 0 4px 18px;
|
||
position: relative;
|
||
|
||
&::before {
|
||
content: '!';
|
||
position: absolute;
|
||
left: 0;
|
||
width: 14px;
|
||
height: 14px;
|
||
background: #b07a3a;
|
||
color: #fff;
|
||
border-radius: 50%;
|
||
font-size: 10px;
|
||
text-align: center;
|
||
line-height: 14px;
|
||
font-weight: bold;
|
||
top: 7px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.guide-footer {
|
||
margin: 24px 0 4px;
|
||
text-align: center;
|
||
font-size: 12px;
|
||
color: #b0b8c4;
|
||
}
|
||
|
||
@media (max-width: 860px) {
|
||
.split,
|
||
.mode-grid {
|
||
flex-direction: column;
|
||
}
|
||
}
|
||
</style>
|
||
|
||
<style lang="less">
|
||
.export-customs-guide-modal .arco-modal-body {
|
||
padding-top: 8px;
|
||
}
|
||
</style>
|