Bind Feishu identity to OpenVPN sessions and refine management UI
This commit is contained in:
opsx committed
1 parent
347799cb1e
commit
8fd8c0cd73
27 files changed
+1556
-1011
No files matched your search
@@ -106,132 +106,10 @@
|
||||
</template>
|
||||
</el-table>
|
||||
|
||||
<!-- 详情抽屉 -->
|
||||
<el-drawer v-model="detailVisible" :title="detail?.tunnel?.name" size="560px">
|
||||
<template v-if="detail">
|
||||
<el-descriptions :column="1" border size="small">
|
||||
<el-descriptions-item :label="$t('common.protocol')">{{ $t(protocolDisplay(detail.tunnel.protocol)) }}</el-descriptions-item>
|
||||
<el-descriptions-item :label="$t('tunnels.authMethod')">{{ authMethod(detail.tunnel) }}</el-descriptions-item>
|
||||
<el-descriptions-item :label="$t('common.status')">{{ stateText(detail.tunnel) }}</el-descriptions-item>
|
||||
<el-descriptions-item :label="$t('tunnels.createTime')">{{ fmtTime(detail.tunnel.created_at) }}</el-descriptions-item>
|
||||
<el-descriptions-item :label="$t('tunnels.autoStart')">{{ detail.tunnel.auto_start ? $t('common.yes') : $t('common.no') }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<h4>{{ $t('tunnels.runningParams') }}</h4>
|
||||
<pre class="mono conf-box">{{ prettyConfig(detail.tunnel.config) }}</pre>
|
||||
<h4>{{ $t('tunnels.clientConfig') }}</h4>
|
||||
<pre class="mono conf-box">{{ detail.client_config || $t('tunnels.noClientConfig') }}</pre>
|
||||
<el-button type="primary" style="width:100%;margin-bottom:8px" @click="download(detail.tunnel)">{{ $t('tunnels.downloadClientConfig') }}</el-button>
|
||||
<el-button v-if="detail.tunnel.protocol === 'ipsec'" type="warning" plain style="width:100%;margin-bottom:16px"
|
||||
@click="$router.push('/ipsec-peer')">{{ $t('tunnels.ipsecParamCheck') }}</el-button>
|
||||
|
||||
<!-- 流量策略 -->
|
||||
<h4>{{ $t('tunnels.trafficPolicy') }}</h4>
|
||||
<el-form label-width="90px" size="small" v-loading="policyLoading">
|
||||
<el-form-item :label="$t('tunnels.quotaGB')">
|
||||
<el-input-number v-model="policy.quota_gb" :min="0" :precision="1" :step="10" style="width:100%" />
|
||||
<span style="font-size:12px;color:var(--text-secondary);margin-left:8px">{{ $t('tunnels.quotaUnlimited', { used: fmtBytes(policy.used_bytes || 0) }) }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('tunnels.rateLimitMbps')">
|
||||
<el-input-number v-model="policy.rate_limit_mbps" :min="0" :max="10000" style="width:100%" />
|
||||
<span style="font-size:12px;color:var(--text-secondary);margin-left:8px">{{ $t('tunnels.rateUnlimited') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('tunnels.exceedAction')">
|
||||
<el-select v-model="policy.action_on_exceed" style="width:100%">
|
||||
<el-option value="warn" :label="$t('tunnels.actionWarn')" />
|
||||
<el-option value="block" :label="$t('tunnels.actionBlock')" />
|
||||
<el-option value="throttle" :label="$t('tunnels.actionThrottle')" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('tunnels.resetCycle')">
|
||||
<el-select v-model="policy.reset_cycle" style="width:100%">
|
||||
<el-option value="none" :label="$t('tunnels.resetNone')" />
|
||||
<el-option value="daily" :label="$t('tunnels.resetDaily')" />
|
||||
<el-option value="monthly" :label="$t('tunnels.resetMonthly')" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-button type="primary" size="small" :loading="policySaving" @click="savePolicy(detail.tunnel.id)">{{ $t('tunnels.savePolicy') }}</el-button>
|
||||
</el-form>
|
||||
|
||||
<!-- WireGuard Peer 管理 -->
|
||||
<template v-if="detail.tunnel.protocol === 'wireguard'">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;margin:8px 0">
|
||||
<h4 style="margin:0">{{ $t('tunnels.peerList') }}</h4>
|
||||
<el-button type="primary" size="small" @click="openAddPeer">{{ $t('tunnels.addPeer') }}</el-button>
|
||||
</div>
|
||||
<el-table :data="wgPeers" size="small" v-loading="peersLoading">
|
||||
<el-table-column prop="id" label="ID" width="100" />
|
||||
<el-table-column prop="name" :label="$t('common.name')" width="100" />
|
||||
<el-table-column prop="client_address" :label="$t('tunnels.address')" min-width="110" />
|
||||
<el-table-column :label="$t('common.status')" width="80">
|
||||
<template #default="{ row }">
|
||||
<el-tag size="small" :type="peerOnline(row) ? 'success' : 'info'">
|
||||
{{ peerOnline(row) ? $t('tunnels.peerOnline') : $t('tunnels.peerOffline') }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('common.operation')" width="150">
|
||||
<template #default="{ row }">
|
||||
<el-button v-if="row.managed !== false" link size="small" @click="downloadPeer(row)">{{ $t('tunnels.config') }}</el-button>
|
||||
<el-button v-if="row.managed !== false" link size="small" @click="qrPeer(row)">{{ $t('tunnels.qrCode') }}</el-button>
|
||||
<el-button type="danger" link size="small" @click="removePeer(row)">{{ $t('common.delete') }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
<!-- 流量趋势图 -->
|
||||
<TrafficChart v-if="detail.tunnel.id" :tunnel-id="detail.tunnel.id" />
|
||||
</template>
|
||||
</el-drawer>
|
||||
|
||||
<!-- WireGuard 二维码 -->
|
||||
<el-dialog v-model="qrVisible" :title="$t('tunnels.scanQrTitle')" width="360px" align-center>
|
||||
<div style="text-align:center">
|
||||
<canvas ref="qrCanvas"></canvas>
|
||||
<p style="color:#909399;font-size:12px">{{ $t('tunnels.scanQrHint') }}</p>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 添加 Peer -->
|
||||
<el-dialog v-model="peerDialog" :title="$t('tunnels.addPeerTitle')" width="440px">
|
||||
<el-form label-width="110px">
|
||||
<el-form-item :label="$t('tunnels.peerId')">
|
||||
<el-input v-model="peerForm.id" :placeholder="$t('tunnels.autoGenId')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('common.name')">
|
||||
<el-input v-model="peerForm.name" :placeholder="$t('tunnels.peerNamePlaceholder')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('tunnels.clientAddress')" required>
|
||||
<el-input v-model="peerForm.client_address" placeholder="10.8.0.3/32" />
|
||||
</el-form-item>
|
||||
<el-form-item label="AllowedIPs">
|
||||
<el-input v-model="peerForm.allowed_ips" :placeholder="$t('tunnels.defaultAllowedIPs')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('tunnels.externalPublicKey')">
|
||||
<el-input v-model="peerForm.public_key" type="textarea" :rows="2"
|
||||
:placeholder="$t('tunnels.externalKeyHint')" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="peerDialog = false">{{ $t('common.cancel') }}</el-button>
|
||||
<el-button type="primary" :loading="peerSaving" @click="addPeer">{{ $t('common.add') }}</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<TunnelDetailDrawer ref="detailDrawer" @updated="load" />
|
||||
</el-card>
|
||||
|
||||
<!-- 日志实时查看弹窗 -->
|
||||
<el-dialog v-model="logVisible" :title="$t('tunnels.logTitle', { name: logTunnel?.name || '' })" width="780px" align-center
|
||||
@close="closeLogStream">
|
||||
<div class="log-toolbar">
|
||||
<el-tag size="small" :type="logStreaming ? 'success' : 'info'">
|
||||
{{ logStreaming ? $t('tunnels.liveOutput') : $t('tunnels.logStopped') }}
|
||||
</el-tag>
|
||||
<el-button v-if="logStreaming" size="small" @click="stopLogStream">{{ $t('tunnels.pause') }}</el-button>
|
||||
<el-button v-else size="small" type="primary" @click="resumeLogStream">{{ $t('tunnels.resume') }}</el-button>
|
||||
<el-button size="small" @click="logContent = ''">{{ $t('tunnels.clearScreen') }}</el-button>
|
||||
</div>
|
||||
<div class="log-view mono" ref="logView">{{ logContent || $t('tunnels.waitingLog') }}</div>
|
||||
</el-dialog>
|
||||
<TunnelLogDialog ref="logDialog" />
|
||||
|
||||
<!-- 批量任务进度 -->
|
||||
<TaskProgress ref="taskProgressRef" />
|
||||
@@ -242,13 +120,13 @@ import { ref, computed, onMounted, onUnmounted, nextTick } from 'vue'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { Plus, InfoFilled, ArrowDown, Refresh } from '@element-plus/icons-vue'
|
||||
import QRCode from 'qrcode'
|
||||
import { useRouter } from 'vue-router'
|
||||
import api from '../api'
|
||||
import { fmtBytes } from '../utils/format'
|
||||
import ProtocolIcon from '../components/ProtocolIcon.vue'
|
||||
import TaskProgress from '../components/TaskProgress.vue'
|
||||
import TrafficChart from '../components/TrafficChart.vue'
|
||||
import TunnelDetailDrawer from './tunnels/components/TunnelDetailDrawer.vue'
|
||||
import TunnelLogDialog from './tunnels/components/TunnelLogDialog.vue'
|
||||
import { protocolDisplay, protocolColor } from '../protocols'
|
||||
|
||||
const { t } = useI18n()
|
||||
@@ -262,24 +140,11 @@ const keyword = ref('')
|
||||
const protocolFilter = ref('')
|
||||
const stateFilter = ref('')
|
||||
const protocolOptions = ref([])
|
||||
const detailVisible = ref(false)
|
||||
const detail = ref(null)
|
||||
const qrVisible = ref(false)
|
||||
// 流量策略
|
||||
const policy = ref({ quota_gb: 0, rate_limit_mbps: 0, action_on_exceed: 'block', reset_cycle: 'none', used_bytes: 0 })
|
||||
const policyLoading = ref(false)
|
||||
const policySaving = ref(false)
|
||||
const qrCanvas = ref(null)
|
||||
const wgPeers = ref([])
|
||||
const runtimePeers = ref([])
|
||||
const peersLoading = ref(false)
|
||||
const peerDialog = ref(false)
|
||||
const peerSaving = ref(false)
|
||||
const peerForm = ref({ id: '', name: '', client_address: '', allowed_ips: '', public_key: '' })
|
||||
|
||||
// 批量操作
|
||||
const selectedRows = ref([])
|
||||
const taskProgressRef = ref(null)
|
||||
const logDialog = ref(null)
|
||||
const detailDrawer = ref(null)
|
||||
|
||||
function handleSelectionChange(rows) {
|
||||
selectedRows.value = rows
|
||||
@@ -328,14 +193,6 @@ function authMethod(row) {
|
||||
}
|
||||
return t('tunnels.authUnknown')
|
||||
}
|
||||
function prettyConfig(c) {
|
||||
try { return JSON.stringify(JSON.parse(c), null, 2) } catch { return c }
|
||||
}
|
||||
function peerOnline(row) {
|
||||
const rt = runtimePeers.value.find(p => p.id === row.id || p.public_key === row.public_key)
|
||||
return !!rt?.connected
|
||||
}
|
||||
|
||||
async function load() {
|
||||
const revision = ++loadRevision
|
||||
loading.value = true
|
||||
@@ -353,109 +210,12 @@ async function load() {
|
||||
|
||||
// 更多操作下拉命令分发
|
||||
function onMoreCommand(cmd, row) {
|
||||
if (cmd === 'detail') showDetail(row)
|
||||
if (cmd === 'detail') detailDrawer.value?.open(row)
|
||||
else if (cmd === 'delete') remove(row)
|
||||
else if (cmd === 'download') download(row)
|
||||
else if (cmd === 'qrcode') showQr(row)
|
||||
else if (cmd === 'qrcode') detailDrawer.value?.showQr(row)
|
||||
else if (cmd === 'ipsec-peer') router.push('/ipsec-peer')
|
||||
else if (cmd === 'logs') openLogStream(row)
|
||||
}
|
||||
|
||||
// ---- 实时日志流（SSE via fetch + ReadableStream，避免 token 暴露在 URL）----
|
||||
const logVisible = ref(false)
|
||||
const logTunnel = ref(null)
|
||||
const logContent = ref('')
|
||||
const logStreaming = ref(false)
|
||||
const logView = ref(null)
|
||||
let logAbortController = null
|
||||
|
||||
function openLogStream(row) {
|
||||
logTunnel.value = row
|
||||
logContent.value = ''
|
||||
logVisible.value = true
|
||||
resumeLogStream()
|
||||
}
|
||||
|
||||
async function resumeLogStream() {
|
||||
if (!logTunnel.value) return
|
||||
stopLogStream()
|
||||
const token = localStorage.getItem('vpn_token')
|
||||
logAbortController = new AbortController()
|
||||
logStreaming.value = true
|
||||
try {
|
||||
const resp = await fetch(`/api/tunnels/${logTunnel.value.id}/logs`, {
|
||||
headers: { 'Authorization': `Bearer ${token}` },
|
||||
signal: logAbortController.signal
|
||||
})
|
||||
if (!resp.ok) { logStreaming.value = false; return }
|
||||
const reader = resp.body.getReader()
|
||||
const decoder = new TextDecoder()
|
||||
let buffer = ''
|
||||
while (true) {
|
||||
const { done, value } = await reader.read()
|
||||
if (done) break
|
||||
buffer += decoder.decode(value, { stream: true })
|
||||
const lines = buffer.split('\n')
|
||||
buffer = lines.pop()
|
||||
for (const line of lines) {
|
||||
if (line.startsWith('data: ')) {
|
||||
logContent.value += line.slice(6) + '\n'
|
||||
}
|
||||
}
|
||||
nextTick(() => {
|
||||
if (logView.value) logView.value.scrollTop = logView.value.scrollHeight
|
||||
})
|
||||
if (logContent.value.length > 100000) {
|
||||
logContent.value = logContent.value.slice(-50000)
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
if (e.name !== 'AbortError') logContent.value += `\n${t('common.loadFailed')}\n`
|
||||
}
|
||||
logStreaming.value = false
|
||||
}
|
||||
|
||||
function stopLogStream() {
|
||||
logStreaming.value = false
|
||||
logAbortController?.abort()
|
||||
logAbortController = null
|
||||
}
|
||||
|
||||
function closeLogStream() {
|
||||
stopLogStream()
|
||||
logContent.value = ''
|
||||
}
|
||||
|
||||
// ---- 流量策略 ----
|
||||
async function loadPolicy(tunnelId) {
|
||||
policyLoading.value = true
|
||||
try {
|
||||
const { data } = await api.get(`/tunnels/${tunnelId}/policy`)
|
||||
policy.value = {
|
||||
quota_gb: data.quota_bytes > 0 ? +(data.quota_bytes / (1024 * 1024 * 1024)).toFixed(2) : 0,
|
||||
rate_limit_mbps: data.rate_limit_mbps || 0,
|
||||
action_on_exceed: data.action_on_exceed || 'block',
|
||||
reset_cycle: data.reset_cycle || 'none',
|
||||
used_bytes: data.used_bytes || 0,
|
||||
}
|
||||
} catch { policy.value = { quota_gb: 0, rate_limit_mbps: 0, action_on_exceed: 'block', reset_cycle: 'none', used_bytes: 0 } }
|
||||
finally { policyLoading.value = false }
|
||||
}
|
||||
|
||||
async function savePolicy(tunnelId) {
|
||||
policySaving.value = true
|
||||
try {
|
||||
const quotaBytes = Math.round((policy.value.quota_gb || 0) * 1024 * 1024 * 1024)
|
||||
await api.put(`/tunnels/${tunnelId}/policy`, {
|
||||
quota_bytes: quotaBytes,
|
||||
rate_limit_mbps: policy.value.rate_limit_mbps,
|
||||
action_on_exceed: policy.value.action_on_exceed,
|
||||
reset_cycle: policy.value.reset_cycle,
|
||||
})
|
||||
ElMessage.success(t('tunnels.policySaved'))
|
||||
} catch (e) {
|
||||
ElMessage.error(e.response?.data?.error || t('common.saveFailed'))
|
||||
} finally { policySaving.value = false }
|
||||
else if (cmd === 'logs') logDialog.value?.open(row)
|
||||
}
|
||||
|
||||
async function changeState(row, action) {
|
||||
@@ -491,110 +251,6 @@ async function remove(row) {
|
||||
if (e !== 'cancel') ElMessage.error(e.response?.data?.error || t('common.deleteFailed'))
|
||||
}
|
||||
}
|
||||
async function showDetail(row) {
|
||||
try {
|
||||
const { data } = await api.get(`/tunnels/${row.id}`)
|
||||
detail.value = data
|
||||
detailVisible.value = true
|
||||
if (row.protocol === 'wireguard') {
|
||||
await loadPeers(row.id)
|
||||
} else {
|
||||
wgPeers.value = []
|
||||
runtimePeers.value = []
|
||||
}
|
||||
loadPolicy(row.id)
|
||||
} catch (e) {
|
||||
ElMessage.error(e.response?.data?.error || t('common.loadFailed'))
|
||||
}
|
||||
}
|
||||
|
||||
async function loadPeers(tunnelId) {
|
||||
peersLoading.value = true
|
||||
try {
|
||||
const { data } = await api.get(`/tunnels/${tunnelId}/wireguard/peers`)
|
||||
wgPeers.value = data.peers || []
|
||||
runtimePeers.value = data.runtime_peers || []
|
||||
} catch {
|
||||
wgPeers.value = []
|
||||
} finally {
|
||||
peersLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function openAddPeer() {
|
||||
peerForm.value = { id: '', name: '', client_address: '', allowed_ips: '', public_key: '' }
|
||||
peerDialog.value = true
|
||||
}
|
||||
|
||||
async function addPeer() {
|
||||
if (!peerForm.value.client_address) return ElMessage.warning(t('tunnels.fillClientAddress'))
|
||||
peerSaving.value = true
|
||||
try {
|
||||
const body = { ...peerForm.value }
|
||||
if (!body.id) delete body.id
|
||||
if (!body.public_key) delete body.public_key
|
||||
if (!body.allowed_ips) delete body.allowed_ips
|
||||
await api.post(`/tunnels/${detail.value.tunnel.id}/wireguard/peers`, body)
|
||||
ElMessage.success(t('tunnels.peerAdded'))
|
||||
peerDialog.value = false
|
||||
await loadPeers(detail.value.tunnel.id)
|
||||
const { data } = await api.get(`/tunnels/${detail.value.tunnel.id}`)
|
||||
detail.value = data
|
||||
load()
|
||||
} catch (e) {
|
||||
ElMessage.error(e.response?.data?.error || t('tunnels.addFailed'))
|
||||
} finally {
|
||||
peerSaving.value = false
|
||||
}
|
||||
}
|
||||
|
||||
async function removePeer(row) {
|
||||
await ElMessageBox.confirm(t('tunnels.deletePeerConfirm', { id: row.id }), t('common.confirm'), { type: 'warning' })
|
||||
try {
|
||||
await api.delete(`/tunnels/${detail.value.tunnel.id}/wireguard/peers/${row.id}`)
|
||||
ElMessage.success(t('common.deleteSuccess'))
|
||||
await loadPeers(detail.value.tunnel.id)
|
||||
load()
|
||||
} catch (e) {
|
||||
ElMessage.error(e.response?.data?.error || t('common.deleteFailed'))
|
||||
}
|
||||
}
|
||||
|
||||
function downloadPeer(row) {
|
||||
fetch(`/api/tunnels/${detail.value.tunnel.id}/wireguard/peers/${row.id}/config`, {
|
||||
headers: { Authorization: `Bearer ${localStorage.getItem('vpn_token')}` }
|
||||
}).then(async r => {
|
||||
if (!r.ok) {
|
||||
const d = await r.json()
|
||||
throw new Error(d.error)
|
||||
}
|
||||
return r.blob()
|
||||
}).then(b => {
|
||||
const a = document.createElement('a')
|
||||
a.href = URL.createObjectURL(b)
|
||||
a.download = `wireguard-${row.id}.conf`
|
||||
a.click()
|
||||
}).catch(e => ElMessage.error(e.message || t('tunnels.downloadFailed')))
|
||||
}
|
||||
|
||||
async function qrPeer(row) {
|
||||
try {
|
||||
const res = await fetch(`/api/tunnels/${detail.value.tunnel.id}/wireguard/peers/${row.id}/config`, {
|
||||
headers: { Authorization: `Bearer ${localStorage.getItem('vpn_token')}` }
|
||||
})
|
||||
if (!res.ok) {
|
||||
const d = await res.json()
|
||||
throw new Error(d.error)
|
||||
}
|
||||
const conf = await res.text()
|
||||
qrVisible.value = true
|
||||
await nextTick()
|
||||
QRCode.toCanvas(qrCanvas.value, conf, { width: 280, margin: 1 })
|
||||
} catch (e) {
|
||||
ElMessage.error(e.message || t('tunnels.qrFailed'))
|
||||
}
|
||||
}
|
||||
|
||||
function download(row) {
|
||||
fetch(`/api/tunnels/${row.id}/config`, { headers: { Authorization: `Bearer ${localStorage.getItem('vpn_token')}` } })
|
||||
.then(r => { if (!r.ok) throw new Error(r.statusText); return r.blob() })
|
||||
@@ -609,18 +265,6 @@ function download(row) {
|
||||
})
|
||||
.catch(e => ElMessage.error(e.message || t('tunnels.downloadFailed')))
|
||||
}
|
||||
async function showQr(row) {
|
||||
try {
|
||||
const { data } = await api.get(`/tunnels/${row.id}`)
|
||||
if (!data.client_config) return ElMessage.warning(t('tunnels.noClientConfigWarn'))
|
||||
qrVisible.value = true
|
||||
await nextTick()
|
||||
QRCode.toCanvas(qrCanvas.value, data.client_config, { width: 280, margin: 1 })
|
||||
} catch (e) {
|
||||
ElMessage.error(e.response?.data?.error || t('tunnels.qrFailed'))
|
||||
}
|
||||
}
|
||||
|
||||
let timer
|
||||
onMounted(async () => {
|
||||
load()
|
||||
@@ -643,12 +287,6 @@ onUnmounted(() => clearInterval(timer))
|
||||
@media (max-width: 640px) { .tunnel-search { flex: 1 1 100%; width: 100%; } .tunnel-filter { flex: 1 1 135px; width: auto; } .tunnel-actions { width: 100%; justify-content: flex-end; } }
|
||||
.remark { font-size: 12px; color: var(--text-secondary); }
|
||||
.proto-cell { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
|
||||
.conf-box { background: var(--bg-inset); border: 1px solid var(--border-base); border-radius: var(--radius-sm); padding: 12px; max-height: 260px; overflow: auto; }
|
||||
.log-toolbar { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
|
||||
.log-view {
|
||||
background: #1e1e1e; color: #d4d4d4; border-radius: var(--radius-sm); padding: 16px;
|
||||
height: 400px; overflow-y: auto; font-size: 13px; line-height: 1.6; white-space: pre-wrap; word-break: break-all;
|
||||
}
|
||||
.batch-bar {
|
||||
display: flex; align-items: center; gap: 10px;
|
||||
padding: 10px 16px; margin-bottom: 12px;
|
||||
|
||||
Reference in new issue
Block a user