完善企业编辑页面并修复采购建单重试
This commit is contained in:
@@ -5,6 +5,7 @@ import {
|
||||
clientNavigation,
|
||||
filterNavigationByPermissions,
|
||||
getNavigationParentKeys,
|
||||
getNavigationLeaves,
|
||||
} from '@/navigation/clientNavigation'
|
||||
import { useAuthStore } from '@/modules/auth/public'
|
||||
import { useCustomsPendingStore } from '@/modules/first-leg/public'
|
||||
@@ -40,8 +41,11 @@ onBeforeUnmount(() => {
|
||||
})
|
||||
|
||||
const visibleNavigation = computed(() => filterNavigationByPermissions(clientNavigation, auth.permissionCodes))
|
||||
const activeNavigationPath = computed(() => getNavigationLeaves(visibleNavigation.value)
|
||||
.filter(node => node.path === props.activePath || (node.path !== '/' && props.activePath.startsWith(`${node.path}/`)))
|
||||
.sort((left, right) => right.path.length - left.path.length)[0]?.path ?? props.activePath)
|
||||
|
||||
const activeParentKeys = computed(() => new Set(getNavigationParentKeys(visibleNavigation.value, props.activePath)))
|
||||
const activeParentKeys = computed(() => new Set(getNavigationParentKeys(visibleNavigation.value, activeNavigationPath.value)))
|
||||
const openedKeys = ref<ReadonlySet<string>>(new Set(activeParentKeys.value))
|
||||
// Expand the order group by default so the three customer order shortcuts are visible.
|
||||
openedKeys.value = new Set([...openedKeys.value, 'order-center'])
|
||||
@@ -73,7 +77,7 @@ function handleSelect(path: string) {
|
||||
:key="node.key"
|
||||
:node="node"
|
||||
:badges="badges"
|
||||
:active-path="activePath"
|
||||
:active-path="activeNavigationPath"
|
||||
:opened-keys="openedKeys"
|
||||
:active-parent-keys="activeParentKeys"
|
||||
:level="0"
|
||||
|
||||
@@ -27,6 +27,7 @@ const groupId = computed(() => `client-nav-group-${props.node.key}`)
|
||||
<li
|
||||
class="client-nav-node"
|
||||
v-if="node.children"
|
||||
:data-nav-key="node.key"
|
||||
:class="{
|
||||
'has-divider-before': node.dividerBefore,
|
||||
'is-active-parent': activeParentKeys.has(node.key),
|
||||
@@ -69,7 +70,7 @@ const groupId = computed(() => `client-nav-group-${props.node.key}`)
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li v-else class="client-nav-node" :class="{ 'has-divider-before': node.dividerBefore }">
|
||||
<li v-else class="client-nav-node" :data-nav-key="node.key" :class="{ 'has-divider-before': node.dividerBefore }">
|
||||
<RouterLink
|
||||
:to="node.path"
|
||||
class="client-sidebar-link"
|
||||
|
||||
@@ -9,5 +9,6 @@ export async function requireOrderBudget(kind: 'procurement' | 'trucking', key:
|
||||
await new Promise(resolve => setTimeout(resolve, 1000))
|
||||
result = await apiRequest<BudgetResult>({ method: 'GET', url })
|
||||
}
|
||||
if (!result.usable) throw new Error(result.message || '余额及授信校验未完成，请稍后重试')
|
||||
// 已绑定订单沿用原键恢复创建结果；审核释放预占后也不能重置请求键重复下单。
|
||||
if (!result.usable && !result.orderNo) throw new Error(result.message || '余额及授信校验未完成，请稍后重试')
|
||||
}
|
||||
|
||||
@@ -261,6 +261,54 @@ test('unchanged create retries reuse the idempotency key', async () => {
|
||||
} finally { harness.dispose() }
|
||||
})
|
||||
|
||||
test('a lost create response recovers the original order after review releases its budget', async () => {
|
||||
for (const status of ['RELEASE_PENDING', 'RELEASED', 'RELEASE_FAILED']) {
|
||||
const budgetCalls = [], createCalls = []
|
||||
let boundOrder = null
|
||||
const budgets = moduleFrom(readFileSync(new URL('./api/orderBudgets.ts', import.meta.url), 'utf8'), name => {
|
||||
assert.equal(name, '@/api/http')
|
||||
return { apiRequest: async request => {
|
||||
budgetCalls.push(normalized(request))
|
||||
return boundOrder
|
||||
? { status, usable: false, orderNo: boundOrder, message: '本次资金预占已释放，请重新下单' }
|
||||
: { status: 'FROZEN', usable: true, orderNo: null }
|
||||
} }
|
||||
})
|
||||
const harness = viewHarness({ createPage: true, api: {
|
||||
requireOrderBudget: budgets.requireOrderBudget,
|
||||
createProcurement: async payload => {
|
||||
createCalls.push(normalized(payload))
|
||||
if (!boundOrder) { boundOrder = 'CG-EXISTING'; throw new ApiError('timeout', 'TIMEOUT') }
|
||||
assert.equal(payload.idempotencyKey, createCalls[0].idempotencyKey)
|
||||
return { order: { orderNo: boundOrder } }
|
||||
},
|
||||
} })
|
||||
try {
|
||||
Object.assign(harness.state.form, draft())
|
||||
await harness.state.submit()
|
||||
assert.equal(harness.state.submitError.value, 'timeout')
|
||||
await harness.state.submit()
|
||||
assert.equal(createCalls.length, 2, status)
|
||||
assert.equal(budgetCalls[0].url, budgetCalls[1].url)
|
||||
assert.equal(harness.state.submitError.value, '')
|
||||
assert.equal(harness.state.submittedOrder.value, 'CG-EXISTING')
|
||||
assert.equal(harness.pushes[0].name, 'cross-border-procurement')
|
||||
await harness.state.submit()
|
||||
assert.equal(createCalls.length, 2)
|
||||
} finally { harness.dispose() }
|
||||
}
|
||||
})
|
||||
|
||||
test('an unbound released or failed budget still blocks procurement and trucking submission', async () => {
|
||||
for (const kind of ['procurement', 'trucking']) for (const status of ['FROZEN', 'RELEASE_PENDING', 'RELEASED', 'RELEASE_FAILED', 'FAILED']) {
|
||||
const budgets = moduleFrom(readFileSync(new URL('./api/orderBudgets.ts', import.meta.url), 'utf8'), name => {
|
||||
assert.equal(name, '@/api/http')
|
||||
return { apiRequest: async () => ({ status, usable: false, orderNo: null, message: '资金校验失败' }) }
|
||||
})
|
||||
await assert.rejects(budgets.requireOrderBudget(kind, 'same-key', 100, 'USD'), /资金校验失败/)
|
||||
}
|
||||
})
|
||||
|
||||
test('bill-settled manual fees show review results without counting a balance debit', () => {
|
||||
const bill = determination => ({ ...fee('OTHER', 'NOT_REQUIRED', '100'), determination })
|
||||
assert.equal(presentation.feeStatus(bill('PENDING')), '账单结算 · 待审核')
|
||||
|
||||
@@ -56,7 +56,7 @@ test('supports a standalone dialog and keeps the unpushed billing-weight state v
|
||||
})
|
||||
|
||||
test('shows the published merchant inbound, measurement details and customer confirmation entry', () => {
|
||||
for (const label of ['入仓码', '平台收货仓', '实际毛重', '实测体积', '托盘与库位', '换算与精度', '最终计费量', '单价', '基础费用', '附加费用', '费用合计', '平台备注']) {
|
||||
for (const label of ['入仓码', '平台收货仓', '实际毛重', '实测体积', '换算与精度', '最终计费量', '单价', '基础费用', '附加费用', '费用合计', '平台备注']) {
|
||||
assert.ok(source.includes(label), `missing label: ${label}`)
|
||||
}
|
||||
assert.match(source, /formatInboundMoney\(props\.data\.latestFee\.totalAmount/)
|
||||
@@ -67,7 +67,7 @@ test('shows the published merchant inbound, measurement details and customer con
|
||||
assert.match(source, /confirmMerchantInboundFee/)
|
||||
assert.match(source, /measurementItems/)
|
||||
assert.doesNotMatch(source, /调整费用|发送费用|下载照片/)
|
||||
assert.doesNotMatch(source, /internalNotes|statusHistory|files/)
|
||||
assert.doesNotMatch(source, /internalNotes|statusHistory|files|palletLocations|托盘与库位/)
|
||||
assert.doesNotMatch(source, /latestFee\.(feeVersion|ruleCode|rateCode|chargeRuleVersion|carrierRateVersion|sentAt)/)
|
||||
assert.match(source, /箱规规则/)
|
||||
assert.match(source, /getCalculationRuleLabel\(row\.calculationRuleVersion\)/)
|
||||
@@ -87,7 +87,7 @@ test('keeps the billing summary, confirmation table, notice and footer', () => {
|
||||
test('confirms the selected billing weight and volume even when outer carton totals differ', async () => {
|
||||
const html = await renderConfirmation({
|
||||
latestFee: {
|
||||
actualWeightKg: 570.5, actualVolumeCbm: 3.6894,
|
||||
actualWeightKg: 393, actualVolumeCbm: 3.6894, convertedQuantity: 616.1298,
|
||||
chargeableQuantity: 616.1298, chargeMode: 'KG', chargeUnit: 'KG',
|
||||
unitPrice: 13.6, totalAmount: 8379.37, currency: 'CNY',
|
||||
},
|
||||
@@ -96,10 +96,12 @@ test('confirms the selected billing weight and volume even when outer carton tot
|
||||
unitVolumeCbm: 0.177, totalVolumeCbm: 3.894, volumeWeightKg: 650.298 }],
|
||||
})
|
||||
|
||||
assert.match(html, /570\.5 kg/)
|
||||
assert.match(html, /393 kg/)
|
||||
assert.match(html, /3\.6894 m³/)
|
||||
assert.match(html, /616\.13 kg/)
|
||||
assert.match(html, /8,379\.37/)
|
||||
assert.match(html, /按体积重计费/)
|
||||
assert.doesNotMatch(html, /按重量计费|按毛重计费/)
|
||||
assert.doesNotMatch(html, /3\.894|650\.298|0\.177/)
|
||||
assert.doesNotMatch(confirmationBody, /measurementItems|billingBasis|箱规长|每箱体积/)
|
||||
})
|
||||
@@ -107,7 +109,7 @@ test('confirms the selected billing weight and volume even when outer carton tot
|
||||
test('uses the published volume charge quantity and retains six decimal places', async () => {
|
||||
const html = await renderConfirmation({
|
||||
latestFee: {
|
||||
actualWeightKg: 600, actualVolumeCbm: 1.234567,
|
||||
actualWeightKg: 600, actualVolumeCbm: 1.234567, convertedQuantity: 1.652893,
|
||||
chargeableQuantity: 1.652893, chargeMode: 'CBM', chargeUnit: 'CBM',
|
||||
unitPrice: 100, totalAmount: 165.29, currency: 'CNY',
|
||||
},
|
||||
@@ -115,7 +117,7 @@ test('uses the published volume charge quantity and retains six decimal places',
|
||||
})
|
||||
|
||||
assert.match(html, /计费量/)
|
||||
assert.match(html, /按体积计费/)
|
||||
assert.match(html, /按重量折算体积计费/)
|
||||
assert.match(html, /600 kg/)
|
||||
assert.match(html, /1\.234567 m³/)
|
||||
assert.match(html, /1\.652893 m³/)
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, watch } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { CircleAlert, Clock3, PackageCheck, RefreshCw, TriangleAlert } from '@lucide/vue'
|
||||
import { CircleAlert, Clock3, RefreshCw, TriangleAlert } from '@lucide/vue'
|
||||
import { confirmMerchantInboundFee } from '@/modules/first-leg/api/inboundBilling'
|
||||
import type { MerchantInboundBilling } from '@/modules/first-leg/types/inboundBilling'
|
||||
import {
|
||||
@@ -136,34 +136,13 @@ async function confirmFee() {
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<div class="inbound-result-section">
|
||||
<div class="inbound-section-title">
|
||||
<h4>托盘与库位</h4>
|
||||
<span>{{ props.data.inbound.palletLocations.length }} 个托盘</span>
|
||||
</div>
|
||||
<div v-if="props.data.inbound.palletLocations.length" class="pallet-location-list">
|
||||
<article v-for="item in props.data.inbound.palletLocations" :key="`${item.palletId}-${item.locationId}`">
|
||||
<PackageCheck :size="18" />
|
||||
<div class="pallet-location-main">
|
||||
<strong>{{ item.palletCode }}</strong>
|
||||
<span>库位 {{ item.locationCode }}</span>
|
||||
</div>
|
||||
<div class="pallet-location-quantity">
|
||||
<span>{{ formatInboundMeasure(item.allocatedVolumeCbm, 'm³') }}</span>
|
||||
<span>{{ formatInboundNumber(item.allocatedPackageCount, 0) }} 箱</span>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<p v-else class="inbound-inline-empty">暂无托盘和库位明细</p>
|
||||
</div>
|
||||
|
||||
<div class="inbound-result-section fee-result">
|
||||
<div class="inbound-section-title">
|
||||
<h4>费用结果</h4>
|
||||
<span>{{ props.data.latestFee.feeNo }}</span>
|
||||
</div>
|
||||
<dl class="fee-calculation-grid">
|
||||
<div><dt>计费方式</dt><dd>{{ getChargeModeLabel(props.data.latestFee.chargeMode) }} · {{ getTaxModeLabel(props.data.latestFee.taxMode) }}</dd></div>
|
||||
<div><dt>计费方式</dt><dd>{{ getChargeModeLabel(props.data.latestFee.chargeMode, props.data.latestFee.actualWeightKg, props.data.latestFee.actualVolumeCbm, props.data.latestFee.convertedQuantity) }} · {{ getTaxModeLabel(props.data.latestFee.taxMode) }}</dd></div>
|
||||
<div>
|
||||
<dt>换算与精度</dt>
|
||||
<dd>{{ formatConversionPrecision(
|
||||
@@ -219,7 +198,7 @@ async function confirmFee() {
|
||||
<el-table class="measurement-detail-table fee-dialog-table" :data="[props.data.latestFee]" border>
|
||||
<el-table-column label="计费毛重" min-width="180"><template #default="{ row }">{{ formatInboundMeasure(row.actualWeightKg, 'kg') }}</template></el-table-column>
|
||||
<el-table-column label="计费体积" min-width="180"><template #default="{ row }">{{ formatInboundMeasure(row.actualVolumeCbm, 'm³', 6) }}</template></el-table-column>
|
||||
<el-table-column label="计费方式" min-width="150"><template #default="{ row }">{{ getChargeModeLabel(row.chargeMode) }}</template></el-table-column>
|
||||
<el-table-column label="计费方式" min-width="150"><template #default="{ row }">{{ getChargeModeLabel(row.chargeMode, row.actualWeightKg, row.actualVolumeCbm, row.convertedQuantity) }}</template></el-table-column>
|
||||
<el-table-column label="最终计费量" min-width="180"><template #default="{ row }">{{ formatInboundMeasure(row.chargeableQuantity, row.chargeUnit === 'KG' ? 'kg' : 'm³', row.chargeUnit === 'KG' ? 3 : 6) }}</template></el-table-column>
|
||||
</el-table>
|
||||
<div class="fee-confirm-notice" :class="{ 'is-confirmed': props.data.latestFee.customerConfirmationStatus === 'CONFIRMED' }" role="status">
|
||||
@@ -281,14 +260,6 @@ async function confirmFee() {
|
||||
.fee-confirm-notice > svg { flex:0 0 auto; fill:#eda332; color:#fff; filter:drop-shadow(0 2px 3px rgba(233,154,37,.25)); }
|
||||
.fee-confirm-notice.is-confirmed { border-color:#b7dfc2; background:#f1faf3; color:#2d8a46; }
|
||||
.fee-confirm-notice.is-confirmed > svg { fill:#4eae67; }
|
||||
.pallet-location-list { margin-top: 9px; border-top: 1px solid var(--border); }
|
||||
.pallet-location-list article { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 12px 0; border-bottom: 1px solid var(--border); }
|
||||
.pallet-location-list article > svg { color: var(--primary); }
|
||||
.pallet-location-main, .pallet-location-quantity { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
|
||||
.pallet-location-main strong { overflow-wrap: anywhere; color: var(--navy); font-size: 12px; }
|
||||
.pallet-location-main span, .pallet-location-quantity span { color: var(--muted); font-size: 10px; }
|
||||
.pallet-location-quantity { align-items: flex-end; }
|
||||
.inbound-inline-empty { margin: 9px 0 0; padding: 14px; background: #f6f8f8; color: var(--muted); font-size: 11px; text-align: center; }
|
||||
.fee-result { padding-top: 18px; border-top: 1px solid var(--border); }
|
||||
.fee-calculation-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 10px 0 0; border: 1px solid var(--border); }
|
||||
.fee-calculation-grid > div { min-width: 0; padding: 11px 12px; border-bottom: 1px solid var(--border); }
|
||||
@@ -327,8 +298,6 @@ async function confirmFee() {
|
||||
.inbound-overview, .inbound-measurements, .fee-calculation-grid { grid-template-columns: 1fr; }
|
||||
.inbound-overview > div, .inbound-overview > div:nth-child(odd), .fee-calculation-grid > div, .fee-calculation-grid > div:not(:nth-child(3n)) { border-right: 0; border-bottom: 1px solid var(--border); }
|
||||
.inbound-overview > div:last-child, .fee-calculation-grid > div:last-child { border-bottom: 0; }
|
||||
.pallet-location-list article { grid-template-columns: auto minmax(0, 1fr); }
|
||||
.pallet-location-quantity { grid-column: 2; align-items: flex-start; flex-direction: row; flex-wrap: wrap; gap: 8px; }
|
||||
}
|
||||
|
||||
@media (max-width: 360px) {
|
||||
|
||||
@@ -1,8 +1,23 @@
|
||||
import assert from 'node:assert/strict'
|
||||
import { readFileSync } from 'node:fs'
|
||||
import test from 'node:test'
|
||||
import ts from 'typescript'
|
||||
|
||||
const source = readFileSync(new URL('./inboundBilling.ts', import.meta.url), 'utf8')
|
||||
const { getChargeModeLabel } = await import(`data:text/javascript;base64,${Buffer.from(ts.transpileModule(source, {
|
||||
compilerOptions: { module: ts.ModuleKind.ESNext, target: ts.ScriptTarget.ES2022 },
|
||||
}).outputText).toString('base64')}`)
|
||||
|
||||
test('describes the quantity basis from the published fee instead of treating the charge unit as the basis', () => {
|
||||
assert.equal(getChargeModeLabel('KG', 393, 3.6894, 616.1298), '按体积重计费')
|
||||
assert.equal(getChargeModeLabel('KG', 700, 3.6894, 616.1298), '按毛重计费')
|
||||
assert.equal(getChargeModeLabel('KG', 616.1298, 3.6894, 616.1298), '按毛重计费')
|
||||
assert.equal(getChargeModeLabel('CBM', 600, 1.2, 1.6), '按重量折算体积计费')
|
||||
assert.equal(getChargeModeLabel('CBM', 600, 2, 1.6), '按体积计费')
|
||||
assert.equal(getChargeModeLabel('CBM', 600, 1.6, 1.6), '按体积计费')
|
||||
assert.equal(getChargeModeLabel('KG', 393, 3.6894, Number.NaN), '-')
|
||||
assert.equal(getChargeModeLabel('KG', Number.POSITIVE_INFINITY, 3.6894, 616.1298), '-')
|
||||
})
|
||||
|
||||
test('formats zero values, currencies, measurements, and backend dates without hardcoded business factors', () => {
|
||||
assert.match(source, /value === null \|\| value === undefined/)
|
||||
|
||||
@@ -36,8 +36,18 @@ export function formatInboundDateTime(value: string | null | undefined) {
|
||||
}).format(date)
|
||||
}
|
||||
|
||||
export function getChargeModeLabel(value: 'KG' | 'CBM') {
|
||||
return value === 'KG' ? '按重量计费' : '按体积计费'
|
||||
export function getChargeModeLabel(
|
||||
chargeMode: 'KG' | 'CBM',
|
||||
actualWeightKg: number,
|
||||
actualVolumeCbm: number,
|
||||
convertedQuantity: number,
|
||||
) {
|
||||
const actualQuantity = chargeMode === 'KG' ? actualWeightKg : actualVolumeCbm
|
||||
if (!Number.isFinite(actualQuantity) || !Number.isFinite(convertedQuantity)) return '-'
|
||||
const usesConvertedQuantity = convertedQuantity > actualQuantity
|
||||
return chargeMode === 'KG'
|
||||
? usesConvertedQuantity ? '按体积重计费' : '按毛重计费'
|
||||
: usesConvertedQuantity ? '按重量折算体积计费' : '按体积计费'
|
||||
}
|
||||
|
||||
export function getTaxModeLabel(value: string) {
|
||||
|
||||
@@ -10,14 +10,15 @@
|
||||
|
||||
| 目标 | 页面/路由 | API 与后端 |
|
||||
|---|---|---|
|
||||
| 企业资料、资质上传与状态 | `views/CompanyProfileView.vue`、`utils/qualificationFile.ts`、`utils/qualificationStatus.ts`；`company/profile` | `api/merchantIam.ts`；`iam/`、`file/` |
|
||||
| 企业成员管理 | `views/MembersView.vue`；`organization/members` | 页面经 `store/tenantAdministration.ts` → `api/merchantIam.ts`；`iam/`、`auth/` |
|
||||
| 企业资料、资质上传与状态 | `views/CompanyProfileView.vue`；编辑为 `views/CompanyProfileEditView.vue`、`company/profile/edit`；文件工具为 `utils/qualificationFile.ts`、`utils/qualificationStatus.ts` | `api/merchantIam.ts`；`iam/`、`file/` |
|
||||
| 企业成员管理 | 列表 `views/MembersView.vue`、`organization/members`；新增/编辑 `views/MemberEditorView.vue`、`organization/members/create`、`organization/members/:memberId/edit` | 页面经 `store/tenantAdministration.ts` → `api/merchantIam.ts`；`iam/`、`auth/` |
|
||||
| 企业角色 | `views/RolesView.vue`；`organization/roles` | 页面经 `store/tenantAdministration.ts` → `api/merchantIam.ts`；`iam/` |
|
||||
| 角色权限分配 | `views/PermissionsView.vue`；`organization/permissions` | 页面经 `store/tenantAdministration.ts` → `api/merchantIam.ts`；权限码常量见 `contracts.ts` |
|
||||
| 跨页状态与稳定契约 | `store/tenantAdministration.ts`、`contracts.ts`、`public.ts` | 服务端 DTO |
|
||||
|
||||
## 关键边界
|
||||
|
||||
- 企业资料编辑、成员新增/编辑使用独立路由页面；角色新增/编辑使用居中弹框；权限分配保持独立页面。资质上传、文件预览、密码重置沿用专项弹框。当前承载依据见 [Client 界面样式规范](../../../../../docs/Client界面样式规范.md) 的“企业设置承载方式”。
|
||||
- 企业资料只修改 `contactPhone` 等企业联系信息，不提交或回填成员登录手机号；两者独立维护。
|
||||
- 成员登录手机号可选；修改时由 IAM/Auth 同步并撤销该账号现有会话，前端不互相回填或联动提交。
|
||||
- 审核必填资质仅营业执照与统一社会信用代码；法人身份证选填，可在已有营业执照后单独补传或替换。
|
||||
|
||||
@@ -5,6 +5,21 @@ export const tenantManagementModule = {
|
||||
key: 'company',
|
||||
navigationGroup: { title: '企业管理', icon: Settings, dividerBefore: true },
|
||||
routes: [
|
||||
{
|
||||
path: 'company/profile/edit', name: 'company-profile-edit',
|
||||
component: () => import('./views/CompanyProfileEditView.vue'), release: 'active',
|
||||
meta: { title: '编辑企业资料', permission: 'company:profile:edit', keepAlive: false },
|
||||
},
|
||||
{
|
||||
path: 'organization/members/create', name: 'member-create',
|
||||
component: () => import('./views/MemberEditorView.vue'), release: 'active',
|
||||
meta: { title: '新增成员', permission: 'company:member:create', keepAlive: false },
|
||||
},
|
||||
{
|
||||
path: 'organization/members/:memberId/edit', name: 'member-edit', props: true,
|
||||
component: () => import('./views/MemberEditorView.vue'), release: 'active',
|
||||
meta: { title: '编辑成员', permission: 'company:member:edit', keepAlive: false },
|
||||
},
|
||||
{
|
||||
path: 'company/profile',
|
||||
name: 'company-profile',
|
||||
|
||||
@@ -0,0 +1,80 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
|
||||
import { useTenantAdministrationStore, type TenantCompanyProfile } from '../store/tenantAdministration'
|
||||
import { useAuthStore } from '@/modules/auth/public'
|
||||
|
||||
const store = useTenantAdministrationStore()
|
||||
const auth = useAuthStore()
|
||||
const router = useRouter()
|
||||
const loading = ref(false)
|
||||
const loadError = ref('')
|
||||
const profileSubmitting = ref(false)
|
||||
const profileFormRef = ref<FormInstance>()
|
||||
const draft = reactive<TenantCompanyProfile>({ ...store.company })
|
||||
const canEdit = computed(() => auth.hasPermission('company:profile:edit') && store.company.auditStatus !== 'ARCHIVED')
|
||||
const profileFormRules: FormRules<TenantCompanyProfile> = {
|
||||
companyName: [{ required: true, whitespace: true, message: '请输入公司名称', trigger: 'blur' }],
|
||||
legalRepresentative: [{ required: true, whitespace: true, message: '请输入法人姓名', trigger: 'blur' }],
|
||||
contactName: [{ required: true, whitespace: true, message: '请输入联系人姓名', trigger: 'blur' }],
|
||||
contactPhone: [
|
||||
{ required: true, whitespace: true, message: '请输入公司联系电话', trigger: 'blur' },
|
||||
{ pattern: /^[0-9-]{4,32}$/, message: '公司联系电话仅支持 4–32 位数字或连字符', trigger: 'blur' },
|
||||
],
|
||||
contactEmail: [{ type: 'email', message: '请输入正确的联系邮箱', trigger: 'blur' }],
|
||||
}
|
||||
async function loadCompanyContext() {
|
||||
loading.value = true
|
||||
loadError.value = ''
|
||||
try {
|
||||
await store.loadCompanyContext()
|
||||
Object.assign(draft, store.company)
|
||||
profileFormRef.value?.clearValidate()
|
||||
} catch (error) { loadError.value = error instanceof Error ? error.message : '企业资料加载失败' }
|
||||
finally { loading.value = false }
|
||||
}
|
||||
onMounted(() => void loadCompanyContext())
|
||||
function returnToProfile() { void router.push({ name: 'company-profile' }) }
|
||||
async function saveProfile() {
|
||||
if (profileSubmitting.value || loading.value || loadError.value || !canEdit.value) return
|
||||
const valid = await profileFormRef.value?.validate().then(() => true).catch(() => false)
|
||||
if (!valid) return
|
||||
profileSubmitting.value = true
|
||||
try {
|
||||
await store.updateCompany({ ...draft })
|
||||
ElMessage.success('企业资料已保存')
|
||||
await router.push({ name: 'company-profile' })
|
||||
} catch (error) { ElMessage.error(error instanceof Error ? error.message : '企业资料保存失败') }
|
||||
finally { profileSubmitting.value = false }
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section v-loading="loading" class="company-editor client-ui" :aria-busy="loading">
|
||||
<header class="company-editor-heading"><h2>编辑企业资料</h2><el-button :disabled="profileSubmitting" @click="returnToProfile">返回企业资料</el-button></header>
|
||||
<el-alert v-if="loadError" type="error" :closable="false" :title="loadError"><el-button @click="loadCompanyContext">重新加载</el-button></el-alert>
|
||||
<el-alert v-else-if="!loading && !canEdit" title="当前企业资料不可编辑" type="warning" :closable="false" />
|
||||
<el-form v-else ref="profileFormRef" :model="draft" :rules="profileFormRules" label-position="top" :disabled="loading || profileSubmitting || !canEdit" scroll-to-error @submit.prevent="saveProfile">
|
||||
<section class="company-editor-section">
|
||||
<h3>企业基本信息</h3>
|
||||
<div class="company-editor-grid">
|
||||
<el-form-item label="公司名称" prop="companyName" required><el-input v-model="draft.companyName" placeholder="请输入公司名称" /></el-form-item>
|
||||
<el-form-item label="统一社会信用代码"><el-input v-model="draft.creditCode" disabled placeholder="未登记" /></el-form-item>
|
||||
<el-form-item label="法人姓名" prop="legalRepresentative" required><el-input v-model="draft.legalRepresentative" placeholder="请输入法定代表人姓名" /></el-form-item>
|
||||
</div>
|
||||
</section>
|
||||
<section class="company-editor-section">
|
||||
<h3>联系信息</h3>
|
||||
<div class="company-editor-grid">
|
||||
<el-form-item label="联系人" prop="contactName" required><el-input v-model="draft.contactName" placeholder="请输入联系人姓名" /></el-form-item>
|
||||
<el-form-item label="公司联系电话" prop="contactPhone" required><el-input v-model="draft.contactPhone" maxlength="32" inputmode="tel" placeholder="请输入公司联系电话" /><small class="company-editor-help">仅用于公司业务联系，不会修改任何成员的登录手机号。</small></el-form-item>
|
||||
<el-form-item label="联系邮箱" prop="contactEmail"><el-input v-model="draft.contactEmail" placeholder="请输入联系邮箱（选填）" /></el-form-item>
|
||||
</div>
|
||||
</section>
|
||||
<footer class="company-editor-actions"><el-button :disabled="profileSubmitting" @click="returnToProfile">返回企业资料</el-button><el-button v-if="canEdit" type="primary" native-type="submit" :loading="profileSubmitting">保存修改</el-button></footer>
|
||||
</el-form>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<style scoped src="./companyEditor.css"></style>
|
||||
@@ -1,11 +1,11 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onBeforeUnmount, onMounted, reactive, ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import type { FormInstance, FormRules, UploadFile } from 'element-plus'
|
||||
import type { UploadFile } from 'element-plus'
|
||||
import { Building2, CheckCircle2, Clock3, FileCheck2, FileText, Pencil, Trash2, Upload, UserRound } from '@lucide/vue'
|
||||
import DataTable, { type DataTableColumn } from '@/components/common/DataTable.vue'
|
||||
import { useTenantAdministrationStore, type TenantCompanyProfile, type TenantQualification } from '@/modules/tenant-management/store/tenantAdministration'
|
||||
import { useTenantAdministrationStore, type TenantQualification } from '@/modules/tenant-management/store/tenantAdministration'
|
||||
import { useAuthStore } from '@/modules/auth/public'
|
||||
import { formatQualificationFileSize, qualificationUploadErrorMessage, validateQualificationFile } from '@/modules/tenant-management/utils/qualificationFile'
|
||||
import { qualificationStatusMeta } from '@/modules/tenant-management/utils/qualificationStatus'
|
||||
@@ -20,6 +20,7 @@ import {
|
||||
const store = useTenantAdministrationStore()
|
||||
const auth = useAuthStore()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const companyApproved = computed(() => store.company.auditStatus === 'ACTIVE')
|
||||
const auditStatusCopy = computed(() => ({
|
||||
PROFILE_REQUIRED: { title: '请完善企业资质', detail: '上传营业执照并提交审核后，才能提交头程订单；法人身份证可按需补充。' },
|
||||
@@ -30,7 +31,6 @@ const auditStatusCopy = computed(() => ({
|
||||
ARCHIVED: { title: '企业已归档', detail: '该企业已结束使用，资料和历史业务仅供查看，不能再提交或修改。' },
|
||||
})[store.company.auditStatus])
|
||||
const activeTab = ref('basic')
|
||||
const editing = ref(false)
|
||||
const qualificationOpen = ref(false)
|
||||
const previewOpen = ref(false)
|
||||
const previewRecord = ref<TenantQualification | null>(null)
|
||||
@@ -38,16 +38,13 @@ const previewUrl = ref('')
|
||||
const previewKind = ref<'image' | 'pdf'>('image')
|
||||
const previewError = ref('')
|
||||
const previewLoading = ref(false)
|
||||
const profileFormRef = ref<FormInstance>()
|
||||
const qualificationPage = ref(1)
|
||||
const qualificationPageSize = ref(10)
|
||||
const qualificationSubmitting = ref(false)
|
||||
const reviewSubmitting = ref(false)
|
||||
const deletingQualificationId = ref('')
|
||||
const profileSubmitting = ref(false)
|
||||
const loading = ref(false)
|
||||
const loadError = ref('')
|
||||
const draft = reactive<TenantCompanyProfile>({ ...store.company })
|
||||
type QualificationUploadState = 'idle' | 'uploading' | 'uploaded' | 'error'
|
||||
type QualificationTypeDefinition = { value: MerchantQualificationType; label: string; description: string; required: boolean }
|
||||
type QualificationDraftItem = QualificationTypeDefinition & {
|
||||
@@ -146,16 +143,6 @@ const qualificationReviewDisabledReason = computed(() => {
|
||||
const qualificationPanelHint = computed(() => canUploadQualification.value
|
||||
? '营业执照为必填；法人身份证、货代资质证书、银行开户许可证可选填。文件保存后需另行提交审核。'
|
||||
: qualificationUploadDisabledReason.value)
|
||||
const profileFormRules: FormRules<TenantCompanyProfile> = {
|
||||
companyName: [{ required: true, whitespace: true, message: '请输入公司名称', trigger: 'blur' }],
|
||||
legalRepresentative: [{ required: true, whitespace: true, message: '请输入法人姓名', trigger: 'blur' }],
|
||||
contactName: [{ required: true, whitespace: true, message: '请输入联系人姓名', trigger: 'blur' }],
|
||||
contactPhone: [
|
||||
{ required: true, whitespace: true, message: '请输入公司联系电话', trigger: 'blur' },
|
||||
{ pattern: /^[0-9-]{4,32}$/, message: '公司联系电话仅支持 4–32 位数字或连字符', trigger: 'blur' },
|
||||
],
|
||||
contactEmail: [{ type: 'email', message: '请输入正确的联系邮箱', trigger: 'blur' }],
|
||||
}
|
||||
const qualificationColumns: DataTableColumn[] = [
|
||||
{ key: 'actions', label: '操作', width: 132, fixed: 'left', slotName: 'actions' },
|
||||
{ key: 'type', prop: 'type', label: '文件类型', minWidth: 150 },
|
||||
@@ -173,7 +160,6 @@ async function refreshCompanyContext() {
|
||||
loadError.value = ''
|
||||
try {
|
||||
await store.loadCompanyContext()
|
||||
Object.assign(draft, store.company)
|
||||
return true
|
||||
} catch (error) {
|
||||
loadError.value = error instanceof Error ? error.message : '企业资料加载失败'
|
||||
@@ -197,35 +183,9 @@ onMounted(async () => {
|
||||
onBeforeUnmount(() => qualificationDrafts.forEach(releaseQualificationPreview))
|
||||
|
||||
function startEdit() {
|
||||
if (store.company.auditStatus === 'ARCHIVED') return
|
||||
Object.assign(draft, store.company)
|
||||
profileFormRef.value?.clearValidate()
|
||||
editing.value = true
|
||||
if (!auth.hasPermission('company:profile:edit') || store.company.auditStatus === 'ARCHIVED') return
|
||||
void router.push({ name: 'company-profile-edit' })
|
||||
}
|
||||
|
||||
function cancelEdit() {
|
||||
Object.assign(draft, store.company)
|
||||
editing.value = false
|
||||
profileFormRef.value?.clearValidate()
|
||||
}
|
||||
|
||||
async function saveProfile() {
|
||||
if (profileSubmitting.value) return
|
||||
const valid = await profileFormRef.value?.validate().then(() => true).catch(() => false)
|
||||
if (!valid) return
|
||||
profileSubmitting.value = true
|
||||
try {
|
||||
await store.updateCompany({ ...draft })
|
||||
Object.assign(draft, store.company)
|
||||
editing.value = false
|
||||
ElMessage.success('企业资料已保存')
|
||||
} catch (error) {
|
||||
ElMessage.error(error instanceof Error ? error.message : '企业资料保存失败')
|
||||
} finally {
|
||||
profileSubmitting.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function openQualificationDialog() {
|
||||
if (!canUploadQualification.value) {
|
||||
ElMessage.warning(qualificationUploadDisabledReason.value)
|
||||
@@ -619,23 +579,7 @@ function closeQualificationPreview() {
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<el-drawer v-model="editing" title="编辑企业资料" size="min(620px, 94vw)" @closed="cancelEdit">
|
||||
<el-form ref="profileFormRef" :model="draft" :rules="profileFormRules" label-position="top" class="profile-form">
|
||||
<h3>企业基本信息</h3>
|
||||
<div class="form-grid-two">
|
||||
<el-form-item label="公司名称" prop="companyName" required><el-input v-model="draft.companyName" placeholder="请输入公司名称" /></el-form-item>
|
||||
<el-form-item label="统一社会信用代码"><el-input v-model="draft.creditCode" disabled /></el-form-item>
|
||||
<el-form-item label="法人姓名" prop="legalRepresentative" required><el-input v-model="draft.legalRepresentative" placeholder="请输入法定代表人姓名" /></el-form-item>
|
||||
</div>
|
||||
<h3>联系信息</h3>
|
||||
<div class="form-grid-two">
|
||||
<el-form-item label="联系人" prop="contactName" required><el-input v-model="draft.contactName" placeholder="请输入联系人姓名" /></el-form-item>
|
||||
<el-form-item label="公司联系电话" prop="contactPhone" required><el-input v-model="draft.contactPhone" maxlength="32" inputmode="tel" placeholder="请输入公司联系电话" /><small class="profile-field-hint">仅用于公司业务联系，不会修改任何成员的登录手机号。</small></el-form-item>
|
||||
<el-form-item label="联系邮箱" prop="contactEmail"><el-input v-model="draft.contactEmail" placeholder="请输入联系邮箱（选填）" /></el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
<template #footer><div class="drawer-actions"><el-button :disabled="profileSubmitting" @click="cancelEdit">取消</el-button><el-button type="primary" :loading="profileSubmitting" @click="saveProfile">保存修改</el-button></div></template>
|
||||
</el-drawer>
|
||||
|
||||
|
||||
<el-dialog
|
||||
v-model="qualificationOpen"
|
||||
@@ -741,12 +685,6 @@ function closeQualificationPreview() {
|
||||
.qualification-panel-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
|
||||
.qualification-update-control { display: inline-flex; }
|
||||
.mobile-qualification-list { display: none; }
|
||||
.profile-form h3 { margin: 4px 0 18px; padding-bottom: 10px; border-bottom: 1px solid var(--border); font-size: 15px; }
|
||||
.profile-form h3:not(:first-child) { margin-top: 22px; }
|
||||
.profile-field-hint { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; line-height: 1.5; }
|
||||
.form-grid-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
|
||||
.form-grid-two .full-row { grid-column: 1 / -1; }
|
||||
.drawer-actions { display: flex; justify-content: flex-end; gap: 8px; }
|
||||
.mobile-qualification-actions { display: flex; align-items: center; gap: 8px; }
|
||||
.qualification-dialog-intro { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 16px; padding: 13px 15px; background: #f4f7f7; }
|
||||
.qualification-dialog-intro strong { color: var(--navy); font-size: 13px; }
|
||||
@@ -784,7 +722,7 @@ function closeQualificationPreview() {
|
||||
.document-preview > span { max-width: 440px; padding: 0 16px; color: var(--muted); font-size: 11px; line-height: 1.6; text-align: center; }
|
||||
.document-preview-error { max-width: 440px; margin: 0; padding: 0 16px; color: #9a5a09; font-size: 11px; line-height: 1.6; text-align: center; }
|
||||
@media (max-width: 720px) {
|
||||
.profile-grid, .form-grid-two { grid-template-columns: 1fr; }
|
||||
.profile-grid { grid-template-columns: 1fr; }
|
||||
.qualification-dialog-intro { flex-direction: column; gap: 5px; }
|
||||
.qualification-dialog-intro span { text-align: left; }
|
||||
.qualification-upload-grid { grid-template-columns: 1fr; }
|
||||
|
||||
@@ -0,0 +1,170 @@
|
||||
import assert from 'node:assert/strict'
|
||||
import { readFileSync } from 'node:fs'
|
||||
import { createRequire } from 'node:module'
|
||||
import test from 'node:test'
|
||||
import ts from 'typescript'
|
||||
import { createMemoryHistory, createRouter } from 'vue-router'
|
||||
import { computed } from 'vue'
|
||||
|
||||
const memberSource = readFileSync(new URL('./MemberEditorView.vue', import.meta.url), 'utf8')
|
||||
const profileSource = readFileSync(new URL('./CompanyProfileEditView.vue', import.meta.url), 'utf8')
|
||||
const listSource = readFileSync(new URL('./MembersView.vue', import.meta.url), 'utf8')
|
||||
const rolesSource = readFileSync(new URL('./RolesView.vue', import.meta.url), 'utf8')
|
||||
const transpile = source => ts.transpileModule(source, { compilerOptions: { target: ts.ScriptTarget.ES2022 } }).outputText
|
||||
const compile = (source, bindings, result) => new Function(...Object.keys(bindings), transpile(source) + `\nreturn ${result}`)(...Object.values(bindings))
|
||||
|
||||
test('editor routes use their write permissions, have no sidebar entries, and preserve member IDs on refresh', () => {
|
||||
const source = readFileSync(new URL('../routes.ts', import.meta.url), 'utf8').replace(/^import .*$/gm, '').replace('export const', 'const')
|
||||
const module = compile(source, { Building2: {}, KeyRound: {}, Settings: {}, ShieldCheck: {}, Users: {} }, 'tenantManagementModule')
|
||||
const routes = module.routes.map(({ component, ...route }) => ({ ...route, component: {} }))
|
||||
const router = createRouter({ history: createMemoryHistory(), routes: routes.map(route => ({ ...route, path: '/' + route.path })) })
|
||||
for (const [name, path, permission] of [
|
||||
['member-create', '/organization/members/create', 'company:member:create'],
|
||||
['member-edit', '/organization/members/1234567890123456789/edit', 'company:member:edit'],
|
||||
['company-profile-edit', '/company/profile/edit', 'company:profile:edit'],
|
||||
]) {
|
||||
const resolved = router.resolve(path)
|
||||
assert.equal(resolved.name, name)
|
||||
assert.equal(resolved.meta.permission, permission)
|
||||
assert.equal(resolved.meta.keepAlive, false)
|
||||
assert.equal(module.routes.find(route => route.name === name).navigation, undefined)
|
||||
}
|
||||
assert.equal(router.resolve('/organization/members/1234567890123456789/edit').params.memberId, '1234567890123456789')
|
||||
assert.doesNotMatch(listSource, /<el-drawer/)
|
||||
assert.match(listSource, /name: 'member-edit', params: \{ memberId: member.id \}/)
|
||||
assert.match(rolesSource, /<el-dialog v-model="editorOpen"/)
|
||||
assert.doesNotMatch(rolesSource, /<el-drawer/)
|
||||
})
|
||||
|
||||
function memberLoader(id = '') {
|
||||
const context = {
|
||||
editingId: { value: id }, loading: { value: false }, loadError: { value: '' },
|
||||
form: { password: 'old-input', roleIds: [] }, formRef: { value: { clearValidate() {} } },
|
||||
store: { members: [], async loadRoles() {}, async loadMembers() {} },
|
||||
}
|
||||
const source = memberSource.slice(memberSource.indexOf('let loadVersion ='), memberSource.indexOf('onMounted('))
|
||||
return { ...context, load: compile(source, context, 'loadEditor') }
|
||||
}
|
||||
|
||||
test('direct member edit loads current fields and roles; unknown or failed records do not leave an editable blank form', async () => {
|
||||
const state = memberLoader('member-a')
|
||||
state.store.loadMembers = async () => { state.store.members = [{ id: 'member-a', name: '成员甲', account: 'member.a', phone: '', email: '', roleIds: ['role-a'] }] }
|
||||
await state.load()
|
||||
assert.equal(state.form.name, '成员甲')
|
||||
assert.deepEqual(state.form.roleIds, ['role-a'])
|
||||
assert.equal(state.form.password, '')
|
||||
state.form.roleIds.push('role-b')
|
||||
assert.deepEqual(state.store.members[0].roleIds, ['role-a'])
|
||||
state.editingId.value = 'missing'
|
||||
await state.load()
|
||||
assert.match(state.loadError.value, /不存在或已不可访问/)
|
||||
assert.equal(state.form.name, '')
|
||||
state.store.loadMembers = async () => { throw new Error('查询失败') }
|
||||
await state.load()
|
||||
assert.equal(state.loadError.value, '查询失败')
|
||||
assert.equal(state.loading.value, false)
|
||||
})
|
||||
|
||||
test('a late previous member request cannot overwrite the newly selected member', async () => {
|
||||
const state = memberLoader('member-a')
|
||||
const resolves = []
|
||||
state.store.loadRoles = () => new Promise(resolve => resolves.push(resolve))
|
||||
state.store.members = [
|
||||
{ id: 'member-a', name: '甲', account: 'member.a', phone: '', email: '', roleIds: [] },
|
||||
{ id: 'member-b', name: '乙', account: 'member.b', phone: '', email: '', roleIds: [] },
|
||||
]
|
||||
const previous = state.load()
|
||||
state.editingId.value = 'member-b'
|
||||
const current = state.load()
|
||||
resolves[1]()
|
||||
await current
|
||||
assert.equal(state.form.name, '乙')
|
||||
resolves[0]()
|
||||
await previous
|
||||
assert.equal(state.form.name, '乙')
|
||||
})
|
||||
|
||||
function memberSaver(editing = false) {
|
||||
const requests = [], routes = [], errors = []
|
||||
const context = {
|
||||
editingId: { value: editing ? 'member-a' : '' }, saving: { value: false }, loading: { value: false }, loadError: { value: '' }, canSave: { value: true },
|
||||
form: { name: ' 成员 ', account: 'member.a', password: 'Test1234', phone: '', email: '', roleIds: ['role-a'] },
|
||||
formRef: { value: { async validate() { return true }, async validateField() { return true } } },
|
||||
store: { async createMember(payload) { requests.push({ kind: 'create', payload }) }, async updateMember(id, payload) { requests.push({ kind: 'edit', id, payload }) } },
|
||||
router: { async push(route) { routes.push(route) } }, ElMessage: { success() {}, error(message) { errors.push(message) } },
|
||||
}
|
||||
const source = memberSource.slice(memberSource.indexOf('async function saveMember()'), memberSource.indexOf('</script>'))
|
||||
return { ...context, requests, routes, errors, save: compile(source, context, 'saveMember') }
|
||||
}
|
||||
|
||||
test('member create and edit retain distinct payloads and return to the list only after success', async () => {
|
||||
const create = memberSaver()
|
||||
await create.save()
|
||||
assert.equal(create.requests[0].kind, 'create')
|
||||
assert.equal(create.requests[0].payload.password, 'Test1234')
|
||||
assert.equal(create.form.password, '')
|
||||
assert.deepEqual(create.routes, [{ name: 'members' }])
|
||||
const edit = memberSaver(true)
|
||||
await edit.save()
|
||||
assert.equal(edit.requests[0].kind, 'edit')
|
||||
assert.equal(edit.requests[0].id, 'member-a')
|
||||
assert.equal(edit.requests[0].payload.password, undefined)
|
||||
assert.deepEqual(edit.requests[0].payload.roleIds, ['role-a'])
|
||||
})
|
||||
|
||||
test('member permission, loading and invalid forms block writes; save failure keeps input for retry', async () => {
|
||||
for (const field of ['saving', 'loading', 'loadError', 'canSave']) {
|
||||
const state = memberSaver()
|
||||
state[field].value = field === 'canSave' ? false : true
|
||||
await state.save()
|
||||
assert.equal(state.requests.length, 0)
|
||||
}
|
||||
const invalid = memberSaver()
|
||||
invalid.formRef.value.validate = async () => { throw new Error('invalid') }
|
||||
await invalid.save()
|
||||
assert.equal(invalid.requests.length, 0)
|
||||
const failed = memberSaver()
|
||||
failed.store.createMember = async () => { throw new Error('创建失败') }
|
||||
await failed.save()
|
||||
assert.deepEqual(failed.errors, ['创建失败'])
|
||||
assert.deepEqual(failed.routes, [])
|
||||
assert.equal(failed.form.password, 'Test1234')
|
||||
assert.equal(failed.saving.value, false)
|
||||
})
|
||||
|
||||
test('member validation still requires create password, valid login phone, email and at least one role', async () => {
|
||||
const { default: Schema } = createRequire(import.meta.resolve('element-plus'))('async-validator')
|
||||
const source = memberSource.slice(memberSource.indexOf('const memberRules:'), memberSource.indexOf('let loadVersion'))
|
||||
const rules = compile(source, {}, 'memberRules')
|
||||
const validator = new Schema(rules)
|
||||
const valid = { name: '成员', account: 'member.a', password: 'Test1234', phone: '', email: '', roleIds: ['role-a'] }
|
||||
await validator.validate(valid)
|
||||
for (const patch of [{ password: '' }, { phone: '123' }, { email: 'bad-email' }, { roleIds: [] }, { name: ' ' }]) {
|
||||
await assert.rejects(validator.validate({ ...valid, ...patch }))
|
||||
}
|
||||
})
|
||||
|
||||
test('archived company blocks direct editing, and failed company saves preserve contact data', async () => {
|
||||
const expression = profileSource.match(/^const canEdit = .*$/m)[0]
|
||||
const store = { company: { auditStatus: 'ARCHIVED' }, async updateCompany() { throw new Error('保存失败') } }
|
||||
const canEdit = compile(expression, { computed, auth: { hasPermission: () => true }, store }, 'canEdit')
|
||||
assert.equal(canEdit.value, false)
|
||||
const errors = [], routes = []
|
||||
const context = {
|
||||
profileSubmitting: { value: false }, loading: { value: false }, loadError: { value: '' }, canEdit: { value: false },
|
||||
profileFormRef: { value: { async validate() { return true } } }, draft: { companyName: '企业', contactPhone: '010-12345678' }, store,
|
||||
ElMessage: { success() {}, error(message) { errors.push(message) } }, router: { async push(route) { routes.push(route) } },
|
||||
}
|
||||
const source = profileSource.slice(profileSource.indexOf('async function saveProfile()'), profileSource.indexOf('</script>'))
|
||||
const save = compile(source, context, 'saveProfile')
|
||||
await save()
|
||||
assert.deepEqual(errors, [])
|
||||
context.canEdit.value = true
|
||||
await save()
|
||||
assert.deepEqual(errors, ['保存失败'])
|
||||
assert.equal(context.draft.contactPhone, '010-12345678')
|
||||
assert.deepEqual(routes, [])
|
||||
store.updateCompany = async payload => { assert.equal(payload.contactPhone, '010-12345678'); assert.equal(payload.phone, undefined) }
|
||||
await save()
|
||||
assert.deepEqual(routes, [{ name: 'company-profile' }])
|
||||
})
|
||||
@@ -0,0 +1,113 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref, watch } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
|
||||
import { useTenantAdministrationStore } from '../store/tenantAdministration'
|
||||
import { useAuthStore } from '@/modules/auth/public'
|
||||
|
||||
const props = withDefaults(defineProps<{ memberId?: string }>(), { memberId: '' })
|
||||
const router = useRouter()
|
||||
const store = useTenantAdministrationStore()
|
||||
const auth = useAuthStore()
|
||||
const editingId = computed(() => props.memberId)
|
||||
const title = computed(() => editingId.value ? '编辑成员' : '新增成员')
|
||||
const canGrantMemberRole = computed(() => auth.hasPermission('company:member:grant-role'))
|
||||
const canSave = computed(() => auth.hasPermission(editingId.value ? 'company:member:edit' : 'company:member:create'))
|
||||
const loading = ref(false)
|
||||
const loadError = ref('')
|
||||
const saving = ref(false)
|
||||
const formRef = ref<FormInstance>()
|
||||
const form = reactive({ name: '', account: '', password: '', phone: '', email: '', roleIds: [] as string[] })
|
||||
const memberRules: FormRules = {
|
||||
name: [{ required: true, whitespace: true, message: '请输入成员姓名', trigger: 'blur' }],
|
||||
account: [
|
||||
{ required: true, message: '请输入登录账号', trigger: 'blur' },
|
||||
{ pattern: /^[A-Za-z0-9_.@-]{4,64}$/, message: '账号需为 4–64 位字母、数字或 _ . @ -', trigger: 'blur' },
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: '请输入初始密码', trigger: 'blur' },
|
||||
{ pattern: /^(?=.*[A-Za-z])(?=.*\d).{8,64}$/, message: '密码需为 8–64 位，并同时包含字母和数字', trigger: 'blur' },
|
||||
],
|
||||
phone: [{ pattern: /^1[3-9]\d{9}$/, message: '请输入有效的中国大陆登录手机号', trigger: 'blur' }],
|
||||
email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: 'blur' }],
|
||||
roleIds: [{ type: 'array', required: true, min: 1, message: '请至少选择一个成员角色', trigger: 'change' }],
|
||||
}
|
||||
let loadVersion = 0
|
||||
async function loadEditor() {
|
||||
const version = ++loadVersion
|
||||
loading.value = true
|
||||
loadError.value = ''
|
||||
Object.assign(form, { name: '', account: '', password: '', phone: '', email: '', roleIds: [] })
|
||||
try {
|
||||
await Promise.all([store.loadRoles(), ...(editingId.value ? [store.loadMembers()] : [])])
|
||||
if (version !== loadVersion) return
|
||||
if (editingId.value) {
|
||||
const member = store.members.find(item => item.id === editingId.value)
|
||||
if (!member) throw new Error('该成员不存在或已不可访问，请返回成员列表重新选择')
|
||||
Object.assign(form, { name: member.name, account: member.account, phone: member.phone, email: member.email, roleIds: [...member.roleIds] })
|
||||
}
|
||||
formRef.value?.clearValidate()
|
||||
} catch (error) {
|
||||
if (version === loadVersion) loadError.value = error instanceof Error ? error.message : '成员资料加载失败'
|
||||
} finally {
|
||||
if (version === loadVersion) loading.value = false
|
||||
}
|
||||
}
|
||||
onMounted(() => void loadEditor())
|
||||
watch(() => props.memberId, () => void loadEditor())
|
||||
function returnToList() { void router.push({ name: 'members' }) }
|
||||
async function saveMember() {
|
||||
if (saving.value || loading.value || loadError.value || !canSave.value) return
|
||||
form.name = form.name.trim()
|
||||
form.account = form.account.trim()
|
||||
form.phone = form.phone.trim()
|
||||
form.email = form.email.trim()
|
||||
const valid = editingId.value
|
||||
? await formRef.value?.validateField(['name', 'account', 'phone', 'email', 'roleIds']).then(() => true).catch(() => false)
|
||||
: await formRef.value?.validate().catch(() => false)
|
||||
if (!valid) return
|
||||
saving.value = true
|
||||
try {
|
||||
if (editingId.value) {
|
||||
await store.updateMember(editingId.value, { name: form.name, memberNo: form.account, phone: form.phone, email: form.email, roleIds: [...form.roleIds] })
|
||||
ElMessage.success('成员信息已更新')
|
||||
} else {
|
||||
await store.createMember({ ...form, memberNo: form.account, roleIds: [...form.roleIds] })
|
||||
ElMessage.success('成员已新增')
|
||||
}
|
||||
form.password = ''
|
||||
await router.push({ name: 'members' })
|
||||
} catch (error) {
|
||||
ElMessage.error(error instanceof Error ? error.message : '成员保存失败，请重试')
|
||||
} finally { saving.value = false }
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section v-loading="loading" class="company-editor client-ui" :aria-busy="loading">
|
||||
<header class="company-editor-heading"><h2>{{ title }}</h2><el-button :disabled="saving" @click="returnToList">返回列表</el-button></header>
|
||||
<el-alert v-if="loadError" type="error" :closable="false" :title="loadError"><el-button @click="loadEditor">重新加载</el-button></el-alert>
|
||||
<el-form v-else ref="formRef" :model="form" :rules="memberRules" label-position="top" :disabled="saving || loading || !canSave" scroll-to-error @submit.prevent="saveMember">
|
||||
<section class="company-editor-section">
|
||||
<h3>账号信息</h3>
|
||||
<div class="company-editor-grid">
|
||||
<el-form-item label="成员姓名" prop="name" required><el-input v-model="form.name" maxlength="64" placeholder="请输入成员姓名" /></el-form-item>
|
||||
<el-form-item label="登录账号" prop="account" required><el-input v-model="form.account" :disabled="Boolean(editingId)" maxlength="64" placeholder="4–64 位字母、数字或 _ . @ -" /></el-form-item>
|
||||
<el-form-item v-if="!editingId" label="初始密码" prop="password" required><el-input v-model="form.password" type="password" show-password autocomplete="new-password" maxlength="64" placeholder="8–64 位，同时包含字母和数字" /></el-form-item>
|
||||
</div>
|
||||
</section>
|
||||
<section class="company-editor-section">
|
||||
<h3>联系信息与角色</h3>
|
||||
<div class="company-editor-grid">
|
||||
<el-form-item label="登录手机号" prop="phone"><el-input v-model="form.phone" maxlength="11" inputmode="tel" autocomplete="tel" placeholder="请输入登录手机号（选填）" /><span class="company-editor-help">用于该成员手机号登录；修改后会同步认证账号并退出该成员现有会话。</span></el-form-item>
|
||||
<el-form-item label="邮箱" prop="email"><el-input v-model="form.email" maxlength="128" placeholder="请输入邮箱（选填）" /></el-form-item>
|
||||
<el-form-item label="成员角色" prop="roleIds" required><el-select v-model="form.roleIds" multiple :disabled="Boolean(editingId) && !canGrantMemberRole" placeholder="请选择角色" popper-class="company-editor-popper"><el-option v-for="role in store.roles.filter((item) => item.status === 'ACTIVE' && (!item.builtin || form.roleIds.includes(item.id)))" :key="role.id" :label="role.name" :value="role.id" :disabled="role.builtin" /></el-select></el-form-item>
|
||||
</div>
|
||||
</section>
|
||||
<p v-if="!editingId" class="company-editor-help">请通过安全渠道将初始密码交给成员；前端不会保存或再次展示该密码。</p>
|
||||
<footer class="company-editor-actions"><el-button :disabled="saving" @click="returnToList">返回列表</el-button><el-button v-if="canSave" type="primary" native-type="submit" :loading="saving">{{ editingId ? '保存修改' : '新增成员' }}</el-button></footer>
|
||||
</el-form>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<style scoped src="./companyEditor.css"></style>
|
||||
@@ -1,6 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
|
||||
import { computed, onMounted, ref } from 'vue'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { KeyRound, Pencil, Plus } from '@lucide/vue'
|
||||
import QueryToolbar, { type QueryField, type QueryModel } from '@/components/common/QueryToolbar.vue'
|
||||
import DataTable, { type DataTableColumn } from '@/components/common/DataTable.vue'
|
||||
@@ -9,31 +10,13 @@ import { useAuthStore } from '@/modules/auth/public'
|
||||
|
||||
const store = useTenantAdministrationStore()
|
||||
const auth = useAuthStore()
|
||||
const router = useRouter()
|
||||
const memberFilters = ref({ keyword: '', status: '' as TenantRecordStatus | '' })
|
||||
const appliedMemberFilters = ref({ ...memberFilters.value })
|
||||
const memberPage = ref(1)
|
||||
const memberPageSize = ref(10)
|
||||
const editorOpen = ref(false)
|
||||
const editingId = ref('')
|
||||
const loading = ref(false)
|
||||
const loadError = ref('')
|
||||
const saving = ref(false)
|
||||
const formRef = ref<FormInstance>()
|
||||
const form = reactive({ name: '', account: '', password: '', phone: '', email: '', roleIds: [] as string[] })
|
||||
const memberRules: FormRules = {
|
||||
name: [{ required: true, message: '请输入成员姓名', trigger: 'blur' }],
|
||||
account: [
|
||||
{ required: true, message: '请输入登录账号', trigger: 'blur' },
|
||||
{ pattern: /^[A-Za-z0-9_.@-]{4,64}$/, message: '账号需为 4–64 位字母、数字或 _ . @ -', trigger: 'blur' },
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: '请输入初始密码', trigger: 'blur' },
|
||||
{ pattern: /^(?=.*[A-Za-z])(?=.*\d).{8,64}$/, message: '密码需为 8–64 位，并同时包含字母和数字', trigger: 'blur' },
|
||||
],
|
||||
phone: [{ pattern: /^1[3-9]\d{9}$/, message: '请输入有效的中国大陆登录手机号', trigger: 'blur' }],
|
||||
email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: 'blur' }],
|
||||
roleIds: [{ type: 'array', required: true, min: 1, message: '请至少选择一个成员角色', trigger: 'change' }],
|
||||
}
|
||||
|
||||
const memberQueryFields: QueryField[] = [
|
||||
{ key: 'keyword', type: 'input', placeholder: '姓名、账号、登录手机号或邮箱' },
|
||||
@@ -56,7 +39,6 @@ const filteredMembers = computed(() => store.members.filter((member) => {
|
||||
const pagedMembers = computed(() => filteredMembers.value.slice((memberPage.value - 1) * memberPageSize.value, memberPage.value * memberPageSize.value))
|
||||
const canCreateMember = computed(() => auth.hasPermission('company:member:create'))
|
||||
const canEditMember = computed(() => auth.hasPermission('company:member:edit'))
|
||||
const canGrantMemberRole = computed(() => auth.hasPermission('company:member:grant-role'))
|
||||
const canChangeMemberStatus = computed(() => auth.hasPermission('company:member:status'))
|
||||
const canResetMemberPassword = computed(() => auth.hasPermission('company:member:reset-password'))
|
||||
|
||||
@@ -83,53 +65,8 @@ function searchMembers(filters: QueryModel) {
|
||||
void loadMembers()
|
||||
}
|
||||
|
||||
function resetForm() {
|
||||
editingId.value = ''
|
||||
Object.assign(form, { name: '', account: '', password: '', phone: '', email: '', roleIds: [] })
|
||||
void nextTick(() => formRef.value?.clearValidate())
|
||||
}
|
||||
|
||||
function openCreate() {
|
||||
resetForm()
|
||||
editorOpen.value = true
|
||||
}
|
||||
|
||||
function openEdit(member: TenantMember) {
|
||||
editingId.value = member.id
|
||||
Object.assign(form, { name: member.name, account: member.account, password: '', phone: member.phone, email: member.email, roleIds: [...member.roleIds] })
|
||||
editorOpen.value = true
|
||||
}
|
||||
|
||||
async function saveMember() {
|
||||
if (saving.value) return
|
||||
form.name = form.name.trim()
|
||||
form.account = form.account.trim()
|
||||
form.phone = form.phone.trim()
|
||||
form.email = form.email.trim()
|
||||
if (!editingId.value || form.password) {
|
||||
const valid = await formRef.value?.validate().catch(() => false)
|
||||
if (!valid) return
|
||||
} else {
|
||||
const valid = await formRef.value?.validateField(['name', 'account', 'phone', 'email', 'roleIds']).then(() => true).catch(() => false)
|
||||
if (!valid) return
|
||||
}
|
||||
saving.value = true
|
||||
try {
|
||||
if (editingId.value) {
|
||||
await store.updateMember(editingId.value, { name: form.name, memberNo: form.account, phone: form.phone, email: form.email, roleIds: [...form.roleIds] })
|
||||
ElMessage.success('成员信息已更新')
|
||||
} else {
|
||||
await store.createMember({ ...form, memberNo: form.account, roleIds: [...form.roleIds] })
|
||||
ElMessage.success('成员已新增')
|
||||
}
|
||||
editorOpen.value = false
|
||||
} catch (error) {
|
||||
ElMessage.error(error instanceof Error ? error.message : '成员保存失败，请重试')
|
||||
} finally {
|
||||
saving.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function openCreate() { void router.push({ name: 'member-create' }) }
|
||||
function openEdit(member: TenantMember) { void router.push({ name: 'member-edit', params: { memberId: member.id } }) }
|
||||
async function toggleStatus(member: TenantMember) {
|
||||
const nextLabel = member.status === 'ACTIVE' ? '停用' : '启用'
|
||||
try {
|
||||
@@ -194,17 +131,7 @@ async function resetPassword(member: TenantMember) {
|
||||
<div v-if="!pagedMembers.length" class="mobile-member-empty">没有匹配的企业成员，请调整筛选条件。</div>
|
||||
</div>
|
||||
|
||||
<el-drawer v-model="editorOpen" :title="editingId ? '编辑成员' : '新增成员'" size="min(520px, 94vw)" @closed="resetForm">
|
||||
<el-form ref="formRef" :model="form" :rules="memberRules" label-position="top">
|
||||
<el-form-item label="成员姓名" prop="name" required><el-input v-model="form.name" maxlength="64" placeholder="例如 张三" /></el-form-item>
|
||||
<el-form-item label="登录账号" prop="account" required><el-input v-model="form.account" :disabled="Boolean(editingId)" maxlength="64" placeholder="4–64 位字母、数字或 _ . @ -" /></el-form-item>
|
||||
<el-form-item v-if="!editingId" label="初始密码" prop="password" required><el-input v-model="form.password" type="password" show-password autocomplete="new-password" maxlength="64" placeholder="8–64 位，同时包含字母和数字" /></el-form-item>
|
||||
<div class="member-form-grid"><el-form-item label="登录手机号" prop="phone"><el-input v-model="form.phone" maxlength="11" inputmode="tel" autocomplete="tel" placeholder="例如 13800138000（选填）" /><span class="member-field-help">用于该成员手机号登录；修改后会同步认证账号并退出该成员现有会话。</span></el-form-item><el-form-item label="邮箱" prop="email"><el-input v-model="form.email" maxlength="128" placeholder="例如 name@example.com（选填）" /></el-form-item></div>
|
||||
<el-form-item label="成员角色" prop="roleIds" required><el-select v-model="form.roleIds" multiple :disabled="Boolean(editingId) && !canGrantMemberRole" placeholder="请选择角色"><el-option v-for="role in store.roles.filter((item) => item.status === 'ACTIVE' && (!item.builtin || form.roleIds.includes(item.id)))" :key="role.id" :label="role.name" :value="role.id" :disabled="role.builtin" /></el-select></el-form-item>
|
||||
<div v-if="!editingId" class="member-form-tip"><KeyRound :size="17" /><span>请通过安全渠道将初始密码交给成员；前端不会保存或再次展示该密码。</span></div>
|
||||
</el-form>
|
||||
<template #footer><div class="drawer-actions"><el-button :disabled="saving" @click="editorOpen = false">取消</el-button><el-button type="primary" :loading="saving" @click="saveMember">保存</el-button></div></template>
|
||||
</el-drawer>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
@@ -223,14 +150,8 @@ async function resetPassword(member: TenantMember) {
|
||||
.member-identity small, .member-contact small { color: var(--muted); font-size: 10px; }
|
||||
.role-tags { display: flex; gap: 5px; flex-wrap: wrap; }
|
||||
.mobile-member-list, .mobile-member-empty { display: none; }
|
||||
.member-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
|
||||
.member-form-tip { display: flex; gap: 10px; padding: 13px; border: 1px solid #cfe1dc; background: #f2f7f6; color: var(--muted); font-size: 11px; line-height: 1.6; }
|
||||
.member-field-help { margin-top: 5px; color: var(--muted); font-size: 10px; line-height: 1.5; }
|
||||
.member-form-tip svg { flex: 0 0 17px; color: var(--primary); }
|
||||
.drawer-actions { display: flex; justify-content: flex-end; gap: 8px; }
|
||||
.members-page :deep(.el-form-item__error) { line-height: 1.45; overflow-wrap: anywhere; }
|
||||
@media (max-width: 720px) {
|
||||
.member-form-grid { grid-template-columns: 1fr; }
|
||||
.desktop-member-table { display: none; }
|
||||
.mobile-member-list { display: grid; gap: 10px; padding: 10px; }
|
||||
.mobile-member-empty { display: grid; min-height: 150px; place-items: center; border-top: 1px solid var(--border); color: #98a2a9; font-size: 13px; text-align: center; }
|
||||
@@ -241,6 +162,5 @@ async function resetPassword(member: TenantMember) {
|
||||
.mobile-member-list dt { color: var(--muted); font-size: 10px; }
|
||||
.mobile-member-list dd { margin: 4px 0 0; font-size: 12px; }
|
||||
.mobile-member-list footer { display: flex; justify-content: flex-end; padding-top: 10px; border-top: 1px solid var(--border); }
|
||||
.drawer-actions { flex-wrap: wrap; }
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -160,15 +160,15 @@ function assignPermissions(role: TenantRole) {
|
||||
</DataTable>
|
||||
</div>
|
||||
|
||||
<el-drawer v-model="editorOpen" :title="editingId ? '编辑角色' : '新增角色'" size="min(500px, 94vw)" @closed="resetForm">
|
||||
<el-form ref="formRef" :model="form" :rules="roleRules" label-position="top">
|
||||
<el-dialog v-model="editorOpen" :title="editingId ? '编辑角色' : '新增角色'" width="560px" align-center :close-on-click-modal="!saving" :close-on-press-escape="!saving" :show-close="!saving" @closed="resetForm">
|
||||
<el-form ref="formRef" :model="form" :rules="roleRules" label-position="top" class="role-editor-form" :disabled="saving">
|
||||
<el-form-item label="角色名称" prop="name" required><el-input v-model="form.name" maxlength="30" placeholder="例如 订单操作员" /></el-form-item>
|
||||
<el-form-item label="角色编码" prop="code" required><el-input v-model="form.code" :disabled="Boolean(editingId)" placeholder="例如 ORDER_OPERATOR" maxlength="40" /></el-form-item>
|
||||
<el-form-item label="角色说明" prop="description" required><el-input v-model="form.description" type="textarea" :rows="4" maxlength="200" show-word-limit placeholder="简要说明该角色的职责和适用范围" /></el-form-item>
|
||||
<div class="role-form-tip">保存后请前往“菜单权限”为角色分配可见菜单和操作权限。</div>
|
||||
<el-form-item class="role-editor-wide" label="角色说明" prop="description" required><el-input v-model="form.description" type="textarea" :rows="4" maxlength="200" show-word-limit placeholder="简要说明该角色的职责和适用范围" /></el-form-item>
|
||||
<div class="role-form-tip role-editor-wide">保存后请前往“菜单权限”为角色分配可见菜单和操作权限。</div>
|
||||
</el-form>
|
||||
<template #footer><div class="drawer-actions"><el-button :disabled="saving" @click="editorOpen = false">取消</el-button><el-button type="primary" :loading="saving" @click="saveRole">保存</el-button></div></template>
|
||||
</el-drawer>
|
||||
<template #footer><div class="dialog-actions"><el-button :disabled="saving" @click="editorOpen = false">取消</el-button><el-button type="primary" :loading="saving" @click="saveRole">保存</el-button></div></template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
@@ -186,7 +186,22 @@ function assignPermissions(role: TenantRole) {
|
||||
.role-identity strong { overflow-wrap: anywhere; }
|
||||
.role-identity code { color: var(--muted); font-size: 10px; }
|
||||
.role-form-tip { padding: 12px; background: #f2f7f6; color: var(--muted); font-size: 11px; }
|
||||
.drawer-actions { display: flex; justify-content: flex-end; gap: 8px; }
|
||||
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; }
|
||||
.roles-page :deep(.el-form-item__error) { line-height: 1.45; overflow-wrap: anywhere; }
|
||||
@media (max-width: 600px) { .drawer-actions { flex-wrap: wrap; } }
|
||||
@media (max-width: 600px) { .dialog-actions { flex-wrap: wrap; } }
|
||||
</style>
|
||||
|
||||
<style scoped>
|
||||
.role-editor-form { --el-color-primary: #2f7bff; --el-text-color-placeholder: #b0b7c3; --el-component-size: 44px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
|
||||
.role-editor-wide { grid-column: 1 / -1; }
|
||||
.role-editor-form :deep(.el-form-item) { min-width: 0; margin: 0; }
|
||||
.role-editor-form :deep(.el-form-item__label) { height: auto; margin: 0 0 6px; padding: 0; color: #374151; font-size: 14px; font-weight: 600; line-height: 20px; }
|
||||
.role-editor-form :deep(.el-form-item__content) { line-height: 20px; }
|
||||
.role-editor-form :deep(.el-form-item__error) { position: absolute; top: auto; bottom: calc(100% + 6px); right: 0; left: auto; max-width: calc(100% - 70px); padding: 0; font-size: 12px; line-height: 20px; text-align: right; }
|
||||
.role-editor-form :deep(.el-input__wrapper) { min-height: 44px; padding: 10px 14px; box-sizing: border-box; border: 1px solid #d5dce8; border-radius: 6px; box-shadow: none; }
|
||||
.role-editor-form :deep(.el-input__inner) { height: 22px; line-height: 22px; }
|
||||
.role-editor-form :deep(.el-textarea__inner) { min-height: 110px; padding: 11px 14px; border: 1px solid #d5dce8; border-radius: 6px; box-shadow: none; }
|
||||
.role-editor-form :deep(.el-input__wrapper.is-focus), .role-editor-form :deep(.el-textarea__inner:focus) { outline: 2px solid #2f7bff; outline-offset: 0; }
|
||||
.role-editor-form :deep(.is-error .el-input__wrapper), .role-editor-form :deep(.is-error .el-textarea__inner) { border-color: #e5484d; }
|
||||
.role-editor-form .role-form-tip { padding: 0; background: transparent; color: #6b7280; font-size: 12px; }
|
||||
</style>
|
||||
|
||||
@@ -4,7 +4,10 @@ import test from 'node:test'
|
||||
|
||||
const routerSource = fs.readFileSync(new URL('../routes.ts', import.meta.url), 'utf8')
|
||||
const profileSource = fs.readFileSync(new URL('./CompanyProfileView.vue', import.meta.url), 'utf8')
|
||||
const membersSource = fs.readFileSync(new URL('./MembersView.vue', import.meta.url), 'utf8')
|
||||
const membersListSource = fs.readFileSync(new URL('./MembersView.vue', import.meta.url), 'utf8')
|
||||
const memberEditorSource = fs.readFileSync(new URL('./MemberEditorView.vue', import.meta.url), 'utf8')
|
||||
const membersSource = membersListSource + '\n' + memberEditorSource
|
||||
const profileEditorSource = fs.readFileSync(new URL('./CompanyProfileEditView.vue', import.meta.url), 'utf8')
|
||||
const rolesSource = fs.readFileSync(new URL('./RolesView.vue', import.meta.url), 'utf8')
|
||||
const permissionsSource = fs.readFileSync(new URL('./PermissionsView.vue', import.meta.url), 'utf8')
|
||||
const storeSource = fs.readFileSync(new URL('../store/tenantAdministration.ts', import.meta.url), 'utf8')
|
||||
@@ -15,7 +18,7 @@ test('routes tenant administration modules to implemented views instead of the p
|
||||
assert.match(routerSource, /path: 'organization\/members'[\s\S]*?MembersView\.vue/)
|
||||
assert.match(routerSource, /path: 'organization\/roles'[\s\S]*?RolesView\.vue/)
|
||||
assert.match(routerSource, /path: 'organization\/permissions'[\s\S]*?PermissionsView\.vue/)
|
||||
assert.equal((routerSource.match(/release: 'active'/g) ?? []).length, 4)
|
||||
assert.equal((routerSource.match(/release: 'active'/g) ?? []).length, 7)
|
||||
assert.doesNotMatch(routerSource, /ModuleView\.vue/)
|
||||
})
|
||||
|
||||
@@ -23,7 +26,7 @@ test('implements company details, contact information and qualification workflow
|
||||
assert.match(profileSource, /企业基本信息/)
|
||||
assert.match(profileSource, /联系信息/)
|
||||
assert.match(profileSource, /资质文件/)
|
||||
assert.match(profileSource, /async function saveProfile\(\)/)
|
||||
assert.match(profileEditorSource, /async function saveProfile\(\)/)
|
||||
assert.match(profileSource, /function submitQualification\(closeDialog = true\)/)
|
||||
assert.match(profileSource, /validateQualificationFile/)
|
||||
assert.match(profileSource, /function removeSelectedFile\(type: MerchantQualificationType\)/)
|
||||
@@ -66,9 +69,9 @@ test('implements company details, contact information and qualification workflow
|
||||
assert.doesNotMatch(profileSource, /<el-table class="desktop-qualification-table"/)
|
||||
assert.doesNotMatch(profileSource, /class="profile-summary-card"/)
|
||||
assert.match(profileSource, /class="info-panel-header"[\s\S]*auth\.hasPermission\('company:profile:edit'\)/)
|
||||
assert.match(profileSource, /ref="profileFormRef" :model="draft" :rules="profileFormRules"/)
|
||||
assert.match(profileSource, /prop="companyName" required><el-input v-model="draft\.companyName" placeholder="请输入公司名称"/)
|
||||
assert.match(profileSource, /const valid = await profileFormRef\.value\?\.validate\(\)/)
|
||||
assert.match(profileEditorSource, /ref="profileFormRef" :model="draft" :rules="profileFormRules"/)
|
||||
assert.match(profileEditorSource, /prop="companyName" required><el-input v-model="draft\.companyName" placeholder="请输入公司名称"/)
|
||||
assert.match(profileEditorSource, /const valid = await profileFormRef\.value\?\.validate\(\)/)
|
||||
assert.match(profileSource, /const requiredQualificationTypes = qualificationTypes\.filter\(\(type\) => type\.required\)/)
|
||||
assert.match(profileSource, /货代资质证书'.*required: false/)
|
||||
assert.match(profileSource, /法人身份证'.*required: false/)
|
||||
@@ -116,9 +119,9 @@ test('implements company details, contact information and qualification workflow
|
||||
assert.match(profileSource, /<dt>注册资本<\/dt><dd>\{\{ store\.company\.registeredCapital/)
|
||||
assert.match(profileSource, /<dt>联系微信<\/dt><dd>\{\{ store\.company\.contactWechat/)
|
||||
assert.match(profileSource, /<dt>公司联系电话<\/dt><dd>\{\{ store\.company\.contactPhone/)
|
||||
assert.match(profileSource, /label="公司联系电话" prop="contactPhone" required/)
|
||||
assert.match(profileSource, /不会修改任何成员的登录手机号/)
|
||||
assert.match(profileSource, /pattern: \/\^\[0-9-\]\{4,32\}\$\//)
|
||||
assert.match(profileEditorSource, /label="公司联系电话" prop="contactPhone" required/)
|
||||
assert.match(profileEditorSource, /不会修改任何成员的登录手机号/)
|
||||
assert.match(profileEditorSource, /pattern: \/\^\[0-9-\]\{4,32\}\$\//)
|
||||
assert.doesNotMatch(profileSource, /<dt>联系电话<\/dt><dd>\{\{ store\.company\.contactPhone/)
|
||||
assert.match(storeSource, /expiresAt: item\.validTo \|\| '长期有效'/)
|
||||
assert.match(storeSource, /fileName: item\.originalFileName\?\.trim\(\) \|\| '—'/)
|
||||
|
||||
@@ -0,0 +1,32 @@
|
||||
.company-editor {
|
||||
--el-color-primary: #2f7bff;
|
||||
--el-text-color-regular: #1f2937;
|
||||
--el-text-color-placeholder: #b0b7c3;
|
||||
width: 100%; min-width: 0; color: #1f2937; background: #f4f7fc;
|
||||
font: 14px/1.5 "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
|
||||
}
|
||||
.company-editor-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
|
||||
.company-editor-heading h2 { margin: 0; font-size: 26px; font-weight: 700; }
|
||||
.company-editor-section { margin-bottom: 12px; }
|
||||
.company-editor-section h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 18px; font-weight: 700; }
|
||||
.company-editor-section h3::before { content: ''; width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #2f7bff; }
|
||||
.company-editor-section:nth-of-type(2) h3::before { background: #0ea5a4; }
|
||||
.company-editor-grid { --el-component-size: 44px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 20px; padding: 16px; border: 1px solid #e3e8f0; border-radius: 10px; background: #fff; }
|
||||
.company-editor-grid :deep(.el-form-item) { min-width: 0; margin: 0; }
|
||||
.company-editor-grid :deep(.el-form-item__label) { height: auto; margin: 0 0 6px; padding: 0; color: #374151; font-size: 14px; font-weight: 600; line-height: 20px; }
|
||||
.company-editor-grid :deep(.el-form-item.is-required .el-form-item__label::before) { color: #e5484d; }
|
||||
.company-editor-grid :deep(.el-form-item__content) { min-width: 0; line-height: 20px; align-content: flex-start; }
|
||||
.company-editor-grid :deep(.el-form-item__error) { position: absolute; top: 0; right: 0; bottom: auto; left: auto; max-width: calc(100% - 120px); padding: 0; transform: translateY(calc(-100% - 6px)); font-size: 12px; line-height: 20px; text-align: right; }
|
||||
.company-editor-grid :deep(.el-input), .company-editor-grid :deep(.el-select) { width: 100%; }
|
||||
.company-editor-grid :deep(.el-input__wrapper), .company-editor-grid :deep(.el-select__wrapper) { min-height: 44px; padding: 10px 14px; box-sizing: border-box; border: 1px solid #d5dce8; border-radius: 6px; box-shadow: none; }
|
||||
.company-editor-grid :deep(.el-input__inner) { height: 22px; color: #1f2937; font-size: 14px; line-height: 22px; }
|
||||
.company-editor-grid :deep(.el-input__wrapper.is-focus), .company-editor-grid :deep(.el-select__wrapper.is-focused) { outline: 2px solid #2f7bff; outline-offset: 0; }
|
||||
.company-editor-grid :deep(.is-error .el-input__wrapper), .company-editor-grid :deep(.is-error .el-select__wrapper) { border-color: #e5484d; }
|
||||
.company-editor-grid :deep(.el-input__inner::placeholder), .company-editor-grid :deep(.el-select__placeholder.is-transparent) { color: #b0b7c3; opacity: 1; }
|
||||
.company-editor-help { display: block; margin: 4px 0 12px; color: #6b7280; font-size: 12px; line-height: 20px; }
|
||||
.company-editor-grid .company-editor-help { margin-bottom: 0; }
|
||||
.company-editor-actions { display: flex; justify-content: flex-end; gap: 12px; }
|
||||
.company-editor-heading :deep(.el-button), .company-editor-actions :deep(.el-button) { min-height: 44px; margin-left: 0; padding: 10px 18px; border: 1px solid #d5dce8; border-radius: 6px; background: #fff; color: #1d5fe0; font-size: 14px; font-weight: 600; box-shadow: none; }
|
||||
.company-editor-actions :deep(.el-button--primary) { padding: 12px 28px; border-color: #2f7bff; background: #2f7bff; color: #fff; }
|
||||
.company-editor-heading :deep(.el-button.is-disabled), .company-editor-actions :deep(.el-button.is-disabled) { opacity: .55; }
|
||||
:global(.company-editor-popper.el-popper) { border: 1px solid #e3e8f0; border-radius: 6px; box-shadow: none; }
|
||||
@@ -29,9 +29,16 @@
|
||||
.client-nav-menu { flex: 1; background: transparent; }
|
||||
.client-nav-submenu { margin: 3px 0 2px 15px; padding: 0 0 0 12px; border-left: 1px solid #e6ebf2; }
|
||||
.client-nav-node { min-width: 0; }
|
||||
.client-nav-menu > .client-nav-node[data-nav-key="dashboard"] { --client-nav-icon-color: #2f7bff; }
|
||||
.client-nav-menu > .client-nav-node[data-nav-key="order-center"] { --client-nav-icon-color: #16a34a; }
|
||||
.client-nav-menu > .client-nav-node[data-nav-key="first-leg-customs-documents"] { --client-nav-icon-color: #8b5cf6; }
|
||||
.client-nav-menu > .client-nav-node[data-nav-key="first-leg-sailing-prices"] { --client-nav-icon-color: #e84877; }
|
||||
.client-nav-menu > .client-nav-node[data-nav-key="overseas-warehouse-center"] { --client-nav-icon-color: #0ea5a4; }
|
||||
.client-nav-menu > .client-nav-node[data-nav-key="finance-center"] { --client-nav-icon-color: #f59e0b; }
|
||||
.client-nav-menu > .client-nav-node[data-nav-key="company-center"] { --client-nav-icon-color: #64748b; }
|
||||
.client-nav-node.has-divider-before { margin-top: 9px; padding-top: 9px; border-top: 1px solid #eef2f7; }
|
||||
.client-sidebar-group-trigger,
|
||||
.client-sidebar-link { display: flex; position: relative; width: 100%; min-height: 46px; min-width: 0; align-items: center; gap: 11px; margin: 2px 0; padding: 7px 10px; border: 1px solid transparent; border-radius: 12px; color: #64748b; font-size: 13px; font-weight: 650; line-height: 1.35; transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease; }
|
||||
.client-sidebar-link { display: flex; position: relative; width: 100%; min-height: 46px; min-width: 0; align-items: center; gap: 11px; margin: 2px 0; padding: 7px 10px; border: 1px solid transparent; border-radius: 12px; color: #374151; font-size: 13px; font-weight: 650; line-height: 1.35; transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease; }
|
||||
.client-sidebar-group-trigger { border: 0; background: transparent; cursor: pointer; text-align: left; }
|
||||
.client-sidebar-link { text-decoration: none; }
|
||||
.client-sidebar-group-trigger:hover,
|
||||
@@ -44,7 +51,7 @@
|
||||
.client-nav-submenu .client-sidebar-link[aria-current="page"] { border-color: #dbeafe; background: #eff6ff; color: #2563eb; font-weight: 650; }
|
||||
.client-nav-node.is-active-parent > .client-sidebar-group-trigger { background: #f8faff; color: #2563eb; font-weight: 650; }
|
||||
.client-sidebar .client-sidebar-group-trigger > .client-sidebar-node-icon,
|
||||
.client-nav-menu > .client-nav-node > .client-sidebar-link > .client-sidebar-node-icon { width: 31px; height: 31px; flex: 0 0 31px; padding: 7px; border-radius: 9px; background: #f1f5f9; color: #64748b; }
|
||||
.client-nav-menu > .client-nav-node > .client-sidebar-link > .client-sidebar-node-icon { width: 31px; height: 31px; flex: 0 0 31px; padding: 7px; border-radius: 9px; background: #f1f5f9; color: var(--client-nav-icon-color, #64748b); }
|
||||
.client-nav-menu > .client-nav-node > .client-sidebar-link[aria-current="page"] > .client-sidebar-node-icon { background: rgba(255, 255, 255, .14); color: #fff; }
|
||||
.client-sidebar .client-sidebar-group-chevron { width: 16px; height: 16px; flex: 0 0 16px; margin-left: auto; transform: rotate(-90deg); transition: transform .2s ease; }
|
||||
.client-sidebar-group-trigger[aria-expanded="true"] .client-sidebar-group-chevron { transform: rotate(0); }
|
||||
|
||||
Reference in New Issue
Block a user