design(v2): 增加审批概率依据与沙盘即时联动并完成验证
This commit is contained in:
@@ -0,0 +1,53 @@
|
||||
// Prototype-only browser checks. Requires Playwright and a Chromium installation.
|
||||
// PROTOTYPE_URL optionally targets the Superdesign preview; otherwise tests saved HTML.
|
||||
const {chromium}=require('playwright');
|
||||
const fs=require('fs'),path=require('path'),{pathToFileURL}=require('url');
|
||||
(async()=>{
|
||||
const dir=path.resolve(process.env.EVIDENCE_DIR||'test-evidence/20260929-probability-prototype/local');fs.mkdirSync(dir,{recursive:true});
|
||||
const browser=await chromium.launch({headless:true,...(process.env.CHROMIUM_PATH?{executablePath:process.env.CHROMIUM_PATH}:{})});
|
||||
const page=await browser.newPage({viewport:{width:1440,height:1000}});const errors=[],checks=[];page.on('pageerror',e=>errors.push(e.message));
|
||||
const check=(name,value)=>{checks.push({name,passed:!!value});if(!value)throw Error(name)};
|
||||
const shot=async(name)=>page.screenshot({path:path.join(dir,name+'.png'),fullPage:true});
|
||||
try{
|
||||
await page.goto(process.env.PROTOTYPE_URL||pathToFileURL(path.join(__dirname,'prescreen-workbench.html')).href,{waitUntil:'networkidle',timeout:60000});
|
||||
await page.waitForFunction(()=>getComputedStyle(document.querySelector('[data-sd-id="1"]')).display==='flex',{timeout:15000});
|
||||
check('P08 baseline 42%',await page.locator('#baseline-probability').innerText()==='42%');
|
||||
check('P08 explicit demo label',await page.getByText('审批通过概率 · 演示值',{exact:true}).isVisible());
|
||||
check('P08 uncalibrated explanation',await page.getByText('人工设定，仅演示交互；未经历史数据校准。',{exact:false}).isVisible());
|
||||
const baseline=await page.locator('#real-recommendation').innerText();await shot('01-overview');
|
||||
await page.locator('#btn-show-basis').click();check('P11 basis opens',await page.locator('#basis-dialog').isVisible());
|
||||
const basis=await page.locator('#basis-dialog').innerText();
|
||||
for(const word of ['DC-CASH','SKILL-04','H-018','RULE-01','非模型计算','原型情景表','不代表红线核查已经通过'])check('P11 trace '+word,basis.includes(word));
|
||||
await shot('02-basis');await page.keyboard.press('Escape');check('P07 focus restored',await page.locator('#btn-show-basis').evaluate(e=>e===document.activeElement));
|
||||
await page.locator('#tab-simulation').click();
|
||||
for(const [bank,title,prob,delta,remaining,reason] of [[false,false,42,0,'2 项','未选择'],[true,false,58,16,'设备权属','银行流水'],[true,true,64,22,'两项证据','不简单相加'],[false,true,51,9,'实际回款','合同'],[false,false,42,0,'2 项','未选择'],[false,true,51,9,'实际回款','合同'],[true,true,64,22,'两项证据','不简单相加']]){
|
||||
await page.locator('#assume-bank').setChecked(bank);await page.locator('#assume-title').setChecked(title);
|
||||
check(`P09 immediate ${bank}/${title} = ${prob}`,await page.locator('#sim-prob-val').innerText()===prob+'%');
|
||||
check(`P09 delta ${delta}`,await page.locator('#sim-prob-delta').innerText()==='+'+delta+' 百分点');
|
||||
check(`P10 remaining ${bank}/${title}`,(await page.locator('#sim-remaining').innerText()).includes(remaining));
|
||||
check(`P10 reason ${bank}/${title}`,(await page.locator('#sim-explanation').innerText()).includes(reason));
|
||||
check('P10 comparison visible',await page.locator('#simulation-comparison').isVisible());
|
||||
}
|
||||
await page.locator('#panel-simulation').scrollIntoViewIfNeeded();await shot('03-simulation-64');
|
||||
await page.locator('#run-simulation').click();check('P11 scenario basis',await page.locator('#basis-dialog').isVisible());await page.keyboard.press('Escape');
|
||||
await page.getByRole('button',{name:'← 返回真实预审'}).click();check('P12 recommendation unchanged',await page.locator('#real-recommendation').innerText()===baseline);check('P12 baseline unchanged',await page.locator('#baseline-probability').innerText()==='42%');
|
||||
check('P05 Jev disabled',await page.getByRole('radio',{name:'Jev官方服务（未配置）'}).isDisabled());
|
||||
await page.getByRole('radio',{name:'关闭专项核查',exact:true}).check();check('P05 off label',(await page.locator('#model-status').innerText()).includes('已关闭'));check('P12 provider preserves baseline',await page.locator('#baseline-probability').innerText()==='42%');
|
||||
await page.locator('#tab-simulation').click();check('P12 provider preserves scenario',await page.locator('#sim-prob-val').innerText()==='64%');await page.locator('#tab-overview').click();await page.getByRole('radio',{name:'本地开源模型（演示）',exact:true}).check();
|
||||
await page.locator('#btn-open-drawer-1').click();await page.locator('#evidence-basis-tab').click();check('P02 evidence',await page.locator('#evidence-basis').isVisible());await page.keyboard.press('Escape');
|
||||
await page.locator('#tab-experience').click();check('P03 experience',await page.locator('#panel-experience').isVisible());await page.locator('#tab-overview').click();
|
||||
await page.locator('#btn-generate-list').click();check('P06 checklist',await page.locator('#checklist-dialog').isVisible());await page.keyboard.press('Escape');
|
||||
await page.locator('#nav-link-4').click();check('P07 validation',await page.locator('#validation-dialog').isVisible());await page.keyboard.press('Escape');
|
||||
for(const width of [1440,1024,390]){
|
||||
await page.setViewportSize({width,height:1000});
|
||||
for(const tab of ['overview','simulation']){
|
||||
await page.locator('#tab-'+tab).click();await page.locator('[data-sd-id="8"]').evaluate(e=>e.scrollTop=0);await shot(`responsive-${width}-${tab}`);
|
||||
check(`P13 document width ${width}/${tab}`,await page.evaluate(()=>document.documentElement.scrollWidth<=innerWidth));
|
||||
check(`P13 content width ${width}/${tab}`,await page.locator('[data-sd-id="8"]').evaluate(e=>e.scrollWidth<=e.clientWidth+1));
|
||||
}
|
||||
}
|
||||
check('P07 mobile nav closed',!await page.locator('#prototype-navigation').isVisible());await page.locator('#mobile-menu').click();check('P07 mobile nav opens',await page.locator('#prototype-navigation').isVisible());await page.locator('#nav-link-2').click();check('P07 mobile navigation',await page.locator('#panel-experience').isVisible()&&!await page.locator('#prototype-navigation').isVisible());
|
||||
check('no runtime errors',errors.length===0);
|
||||
}catch(e){checks.push({name:'execution',passed:false,error:e.message});await shot('failure');}
|
||||
await browser.close();const result={status:checks.every(x=>x.passed)?'PASS':'FAIL',target:process.env.PROTOTYPE_URL||'saved prototype',checks,errors,boundary:'Fictional prototype only; no backend/model connection or independent visual review'};fs.writeFileSync(path.join(dir,'interaction-checks.json'),JSON.stringify(result,null,2));console.log(JSON.stringify(result,null,2));process.exit(result.status==='PASS'?0:1);
|
||||
})();
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 119 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 97 KiB |
@@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="zh-CN"><head>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
||||
<title>兴邦金租 - 智审工作台</title>
|
||||
@@ -12,136 +13,53 @@
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
// Navigation
|
||||
nav: {
|
||||
bg: '#102B27',
|
||||
active: '#244D41',
|
||||
text: '#F3F7F5',
|
||||
muted: '#B1C6BE'
|
||||
},
|
||||
// Workspace
|
||||
nav: { bg: '#102B27', active: '#244D41', text: '#F3F7F5', muted: '#B1C6BE' },
|
||||
canvas: '#F3F5F4',
|
||||
card: '#FFFFFF',
|
||||
panel: '#F8FAF9',
|
||||
border: '#DCE4DF',
|
||||
// Typography
|
||||
ink: {
|
||||
main: '#182D26',
|
||||
sub: '#52675C',
|
||||
mute: '#64766C'
|
||||
},
|
||||
// Interactive
|
||||
primary: {
|
||||
DEFAULT: '#17634C',
|
||||
hover: '#124F3D',
|
||||
text: '#FFFFFF'
|
||||
},
|
||||
// Semantics
|
||||
warning: {
|
||||
text: '#805418',
|
||||
bg: '#FBF2DF'
|
||||
},
|
||||
risk: {
|
||||
text: '#A33C38',
|
||||
bg: '#FBEFEC'
|
||||
},
|
||||
tech: {
|
||||
line: '#226A7A',
|
||||
bg: '#EDF5F7'
|
||||
},
|
||||
normal: {
|
||||
text: '#17634C',
|
||||
bg: '#EAF3EC'
|
||||
}
|
||||
ink: { main: '#182D26', sub: '#52675C', mute: '#64766C' },
|
||||
primary: { DEFAULT: '#17634C', hover: '#124F3D', text: '#FFFFFF' },
|
||||
warning: { text: '#805418', bg: '#FBF2DF' },
|
||||
risk: { text: '#A33C38', bg: '#FBEFEC' },
|
||||
tech: { line: '#226A7A', bg: '#EDF5F7' },
|
||||
normal: { text: '#17634C', bg: '#EAF3EC' }
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ['Microsoft YaHei', 'PingFang SC', 'sans-serif']
|
||||
},
|
||||
spacing: {
|
||||
4: '4px',
|
||||
8: '8px',
|
||||
12: '12px',
|
||||
16: '16px',
|
||||
20: '20px',
|
||||
24: '24px',
|
||||
32: '32px',
|
||||
40: '40px',
|
||||
48: '48px'
|
||||
},
|
||||
borderRadius: {
|
||||
button: '8px',
|
||||
panel: '12px'
|
||||
},
|
||||
boxShadow: {
|
||||
card: '0 4px 20px rgba(16,43,39,.04)'
|
||||
},
|
||||
transitionDuration: {
|
||||
160: '160ms',
|
||||
200: '200ms'
|
||||
}
|
||||
fontFamily: { sans: ['Microsoft YaHei', 'PingFang SC', 'sans-serif'] },
|
||||
spacing: { 4: '4px', 8: '8px', 12: '12px', 16: '16px', 20: '20px', 24: '24px', 32: '32px', 40: '40px', 48: '48px' },
|
||||
borderRadius: { button: '8px', panel: '12px' },
|
||||
boxShadow: { card: '0 4px 20px rgba(16,43,39,.04)' },
|
||||
transitionDuration: { 160: '160ms', 200: '200ms' }
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif;
|
||||
background-color: #F3F5F4;
|
||||
color: #182D26;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body { font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif; background-color: #F3F5F4; color: #182D26; margin: 0; padding: 0; }
|
||||
*:focus-visible { outline: 2px solid #17634C; outline-offset: 2px; }
|
||||
@media (prefers-reduced-motion: reduce) { * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }
|
||||
::-webkit-scrollbar { width: 6px; height: 6px; }
|
||||
::-webkit-scrollbar-track { background: transparent; }
|
||||
::-webkit-scrollbar-thumb { background: #DCE4DF; border-radius: 3px; }
|
||||
::-webkit-scrollbar-thumb:hover { background: #B1C6BE; }
|
||||
[hidden]{display:none!important}main,body [data-sd-id="9"]{min-width:0}button,a,input{touch-action:manipulation}button{cursor:pointer}button:disabled,input:disabled{cursor:not-allowed}
|
||||
#prototype-navigation{flex-shrink:0}#prototype-navigation a:hover,#prototype-navigation a.is-active{background:#244D41;border-radius:8px}#prototype-navigation a:first-child:hover{background:transparent}
|
||||
body [data-sd-id="3"]{gap:16px}body [data-sd-id="5"]{font-size:12px}body [data-sd-id="6"]{white-space:nowrap}body [data-sd-id="11"],body [data-sd-id="14"],body [data-sd-id="20"]{flex-wrap:wrap;gap:16px}body [data-sd-id="22"]{font-size:24px}body [data-sd-id="12"]{font-weight:600}
|
||||
body [data-sd-id="46"]{padding-left:0;padding-right:0;gap:12px}body [data-sd-id="46"] button{padding:12px;min-width:0}body [data-sd-id="60"]{padding:16px 12px;font-size:14px;max-width:104px}body [data-sd-id="42"]{min-height:280px}
|
||||
#panel-overview body [data-sd-id="70"],#panel-overview body [data-sd-id="79"]{font-size:15px}.mobile-menu{display:none}
|
||||
.proto-panel{background:#fff;border:1px solid #DCE4DF;border-radius:12px;padding:24px}.proto-panel h2,.center-dialog h2,.evidence-dialog h2{font-size:22px;font-weight:600;margin:8px 0 16px}.proto-panel h3,.evidence-dialog h3{font-size:16px;font-weight:600;margin:8px 0}.proto-panel p,.evidence-dialog p,.center-dialog p{font-size:15px;line-height:1.75;margin:8px 0 16px}.muted{color:#64766C}.section-eyebrow{font-size:12px;letter-spacing:1.5px;color:#52675C}.notice{padding:16px;border-radius:8px;background:#FBF2DF;color:#805418;font-size:14px;line-height:1.7;margin:16px 0}
|
||||
.experience-timeline{list-style:none;padding:16px 0;margin:0}.experience-timeline li{display:flex;gap:16px;position:relative;padding-bottom:24px}.experience-timeline li:not(:last-child):before{content:'';position:absolute;left:19px;top:40px;bottom:0;width:1px;background:#DCE4DF}.step-num{width:40px;height:40px;display:grid;place-items:center;border:1px solid #DCE4DF;border-radius:50%;background:#F8FAF9;color:#17634C;font-size:14px;flex-shrink:0}.experience-timeline small{font-size:12px;color:#64766C}.condition-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0}.condition-grid>div{background:#F8FAF9;border:1px solid #DCE4DF;border-radius:8px;padding:16px}.condition-grid strong{color:#17634C;font-size:15px}.condition-grid small{font-size:12px;color:#64766C}
|
||||
.primary-button{background:#17634C;color:#fff;border:0;border-radius:8px;min-height:44px;padding:12px 24px;font-size:14px;font-weight:600;margin-top:16px}.primary-button:hover{background:#124F3D}.text-action{color:#17634C;font-size:14px;min-height:44px;text-align:left}.scenario-choice{display:flex;gap:12px;align-items:flex-start;padding:16px;border:1px solid #DCE4DF;border-radius:8px;margin:12px 0;cursor:pointer}.scenario-choice input{margin-top:5px;accent-color:#17634C;width:16px;height:16px}.scenario-choice small{display:block;color:#64766C;font-size:13px;margin-top:8px}
|
||||
dialog{color:#182D26;border:1px solid #DCE4DF;box-shadow:0 16px 48px rgba(16,43,39,.16);padding:24px;background:#fff}dialog::backdrop{background:rgba(16,43,39,.32)}.center-dialog{width:min(560px,calc(100% - 32px));border-radius:12px;max-height:90vh}.evidence-dialog{height:100dvh;max-height:100dvh;width:min(520px,100%);max-width:100%;margin:0 0 0 auto;border-radius:12px 0 0 12px;border-right:0}.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;border-bottom:1px solid #DCE4DF;margin-bottom:20px}.close-button{width:44px;height:44px;font-size:28px;color:#52675C;flex-shrink:0}.drawer-tabs{display:flex;gap:24px;border-bottom:1px solid #DCE4DF;margin-bottom:24px}.drawer-tabs button{min-height:44px;font-size:14px}.drawer-tabs [aria-selected=true]{border-bottom:2px solid #17634C;color:#17634C}blockquote{font-size:18px;line-height:1.9;border-left:3px solid #17634C;padding:24px;background:#F8FAF9;margin:24px 0}.checklist{list-style:decimal;padding-left:24px;font-size:15px;line-height:1.8}.checklist li{padding:8px 0}.checklist p{color:#52675C}
|
||||
@media(max-width:1100px){body [data-sd-id="8"]{flex-direction:column}body [data-sd-id="82"]{width:100%;display:grid;grid-template-columns:1fr 1fr}body [data-sd-id="5"]{line-height:1.6}body [data-sd-id="6"]{display:none}}
|
||||
@media(max-width:768px){.mobile-menu{display:flex;font-size:22px;min-width:44px;height:44px;align-items:center;justify-content:center}#prototype-navigation{display:none!important;position:fixed;top:68px;bottom:0;left:0;z-index:30;min-height:0!important;box-shadow:0 16px 48px rgba(16,43,39,.16)}#prototype-navigation.mobile-open{display:flex!important}body [data-sd-id="8"]{padding:20px}body [data-sd-id="3"]{padding:8px 12px}body [data-sd-id="12"]{font-size:24px}body [data-sd-id="19"]{padding:20px}body [data-sd-id="82"]{display:flex}body [data-sd-id="46"]{display:grid;grid-template-columns:1fr 1fr}body [data-sd-id="53"]{gap:12px}body [data-sd-id="60"]{max-width:none;text-align:center}body [data-sd-id="44"]{display:none}.condition-grid{grid-template-columns:1fr}body [data-sd-id="37"]{gap:24px}body [data-sd-id="26"]{gap:32px}body [data-sd-id="14"]{font-size:14px}.proto-panel{padding:20px}}
|
||||
body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-align:center}input[type=radio]{accent-color:#17634C}#prototype-navigation>a.is-active{background:transparent}
|
||||
|
||||
/* Focus rings */
|
||||
*:focus-visible {
|
||||
outline: 2px solid #17634C;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* Reduced motion */
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
* {
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
scroll-behavior: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Scrollbars */
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #DCE4DF;
|
||||
border-radius: 3px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #B1C6BE;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
[hidden]{display:none!important}main,body [data-sd-id="9"]{min-width:0}button,a,input{touch-action:manipulation}button{cursor:pointer}button:disabled,input:disabled{cursor:not-allowed}
|
||||
#prototype-navigation{flex-shrink:0}#prototype-navigation a:hover,#prototype-navigation a.is-active{background:#244D41;border-radius:8px}#prototype-navigation a:first-child:hover{background:transparent}
|
||||
body [data-sd-id="3"]{gap:16px}body [data-sd-id="5"]{font-size:12px}body [data-sd-id="6"]{white-space:nowrap}body [data-sd-id="11"],body [data-sd-id="14"],body [data-sd-id="20"]{flex-wrap:wrap;gap:16px}body [data-sd-id="22"]{font-size:24px}body [data-sd-id="12"]{font-weight:600}
|
||||
body [data-sd-id="46"]{padding-left:0;padding-right:0;gap:12px}body [data-sd-id="46"] button{padding:12px;min-width:0}body [data-sd-id="60"]{padding:16px 12px;font-size:14px;max-width:104px}body [data-sd-id="42"]{min-height:280px}
|
||||
#panel-overview body [data-sd-id="70"],#panel-overview body [data-sd-id="79"]{font-size:15px}.mobile-menu{display:none}
|
||||
.proto-panel{background:#fff;border:1px solid #DCE4DF;border-radius:12px;padding:24px}.proto-panel h2,.center-dialog h2,.evidence-dialog h2{font-size:22px;font-weight:600;margin:8px 0 16px}.proto-panel h3,.evidence-dialog h3{font-size:16px;font-weight:600;margin:8px 0}.proto-panel p,.evidence-dialog p,.center-dialog p{font-size:15px;line-height:1.75;margin:8px 0 16px}.muted{color:#64766C}.section-eyebrow{font-size:12px;letter-spacing:1.5px;color:#52675C}.notice{padding:16px;border-radius:8px;background:#FBF2DF;color:#805418;font-size:14px;line-height:1.7;margin:16px 0}
|
||||
.experience-timeline{list-style:none;padding:16px 0;margin:0}.experience-timeline li{display:flex;gap:16px;position:relative;padding-bottom:24px}.experience-timeline li:not(:last-child):before{content:'';position:absolute;left:19px;top:40px;bottom:0;width:1px;background:#DCE4DF}.step-num{width:40px;height:40px;display:grid;place-items:center;border:1px solid #DCE4DF;border-radius:50%;background:#F8FAF9;color:#17634C;font-size:14px;flex-shrink:0}.experience-timeline small{font-size:12px;color:#64766C}.condition-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0}.condition-grid>div{background:#F8FAF9;border:1px solid #DCE4DF;border-radius:8px;padding:16px}.condition-grid strong{color:#17634C;font-size:15px}.condition-grid small{font-size:12px;color:#64766C}
|
||||
.primary-button{background:#17634C;color:#fff;border:0;border-radius:8px;min-height:44px;padding:12px 24px;font-size:14px;font-weight:600;margin-top:16px}.primary-button:hover{background:#124F3D}.text-action{color:#17634C;font-size:14px;min-height:44px;text-align:left}.scenario-choice{display:flex;gap:12px;align-items:flex-start;padding:16px;border:1px solid #DCE4DF;border-radius:8px;margin:12px 0;cursor:pointer}.scenario-choice input{margin-top:5px;accent-color:#17634C;width:16px;height:16px}.scenario-choice small{display:block;color:#64766C;font-size:13px;margin-top:8px}
|
||||
dialog{color:#182D26;border:1px solid #DCE4DF;box-shadow:0 16px 48px rgba(16,43,39,.16);padding:24px;background:#fff}dialog::backdrop{background:rgba(16,43,39,.32)}.center-dialog{width:min(560px,calc(100% - 32px));border-radius:12px;max-height:90vh}.evidence-dialog{height:100dvh;max-height:100dvh;width:min(520px,100%);max-width:100%;margin:0 0 0 auto;border-radius:12px 0 0 12px;border-right:0}.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;border-bottom:1px solid #DCE4DF;margin-bottom:20px}.close-button{width:44px;height:44px;font-size:28px;color:#52675C;flex-shrink:0}.drawer-tabs{display:flex;gap:24px;border-bottom:1px solid #DCE4DF;margin-bottom:24px}.drawer-tabs button{min-height:44px;font-size:14px}.drawer-tabs [aria-selected=true]{border-bottom:2px solid #17634C;color:#17634C}blockquote{font-size:18px;line-height:1.9;border-left:3px solid #17634C;padding:24px;background:#F8FAF9;margin:24px 0}.checklist{list-style:decimal;padding-left:24px;font-size:15px;line-height:1.8}.checklist li{padding:8px 0}.checklist p{color:#52675C}
|
||||
@media(max-width:1100px){body [data-sd-id="8"]{flex-direction:column}body [data-sd-id="82"]{width:100%;display:grid;grid-template-columns:1fr 1fr}body [data-sd-id="5"]{line-height:1.6}body [data-sd-id="6"]{display:none}}
|
||||
@media(max-width:768px){.mobile-menu{display:flex;font-size:22px;min-width:44px;height:44px;align-items:center;justify-content:center}#prototype-navigation{display:none!important;position:fixed;top:68px;bottom:0;left:0;z-index:30;min-height:0!important;box-shadow:0 16px 48px rgba(16,43,39,.16)}#prototype-navigation.mobile-open{display:flex!important}body [data-sd-id="8"]{padding:20px}body [data-sd-id="3"]{padding:8px 12px}body [data-sd-id="12"]{font-size:24px}body [data-sd-id="19"]{padding:20px}body [data-sd-id="82"]{display:flex}body [data-sd-id="46"]{display:grid;grid-template-columns:1fr 1fr}body [data-sd-id="53"]{gap:12px}body [data-sd-id="60"]{max-width:none;text-align:center}body [data-sd-id="44"]{display:none}.condition-grid{grid-template-columns:1fr}body [data-sd-id="37"]{gap:24px}body [data-sd-id="26"]{gap:32px}body [data-sd-id="14"]{font-size:14px}.proto-panel{padding:20px}}
|
||||
|
||||
body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-align:center}input[type=radio]{accent-color:#17634C}#prototype-navigation>a.is-active{background:transparent}
|
||||
</style></head>
|
||||
#probability-hero{flex-wrap:wrap}#probability-hero>div{flex-wrap:wrap;gap:12px}#probability-hero>div>span:last-child{white-space:nowrap}#sim-prob-delta{white-space:nowrap}#basis-dialog>div{padding:0;height:auto!important}body [data-sd-id="9"]{flex-shrink:0}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="min-h-screen flex w-full max-w-[1440px] mx-auto bg-canvas overflow-hidden" data-sd-id="1">
|
||||
<!-- Sidebar Navigation -->
|
||||
<aside id="prototype-navigation" style="width:216px;min-height:100vh;background:#102B27;color:#F3F7F5;display:flex;flex-direction:column;padding:32px 16px;font-family:'Microsoft YaHei','PingFang SC',sans-serif;box-sizing:border-box">
|
||||
<a href="#overview" id="nav-link-0" style="display:block;padding:0 12px 32px;text-decoration:none;color:inherit"><strong style="font-size:22px;letter-spacing:2px">兴邦金租</strong><span style="display:block;font-size:12px;letter-spacing:3px;color:#B1C6BE;margin-top:8px">智审工作台</span></a>
|
||||
<div style="padding:0 12px 12px;color:#B1C6BE;font-size:12px">业务工作区</div>
|
||||
@@ -153,10 +71,9 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
</nav>
|
||||
<div style="margin-top:auto;padding:32px 12px 0"><div style="border-top:1px solid #244D41;padding-top:24px"><span style="font-size:14px">演示评审员</span><p style="font-size:12px;line-height:1.6;color:#B1C6BE;margin:8px 0 0">历史经验驱动<br/>每一步判断都有依据</p></div></div>
|
||||
</aside>
|
||||
<!-- Main Workspace -->
|
||||
<main class="flex-1 flex flex-col h-screen overflow-hidden" data-sd-id="2">
|
||||
<!-- Persistent Notice Bar -->
|
||||
<div class="bg-warning-bg text-warning-text px-32 py-12 text-[14px] flex items-center justify-between border-b border-warning-text/10 shrink-0" data-sd-id="3"><button aria-expanded="false" aria-label="打开导航" class="mobile-menu" id="mobile-menu"><iconify-icon icon="lucide:menu"></iconify-icon></button>
|
||||
<div class="bg-warning-bg text-warning-text px-32 py-12 text-[14px] flex items-center justify-between border-b border-warning-text/10 shrink-0" data-sd-id="3">
|
||||
<button aria-expanded="false" aria-label="打开导航" class="mobile-menu" id="mobile-menu"><iconify-icon icon="lucide:menu"></iconify-icon></button>
|
||||
<div class="flex items-center gap-8" data-sd-id="4">
|
||||
<iconify-icon icon="lucide:alert-circle"></iconify-icon>
|
||||
<span data-sd-id="5">原型演示 · 未连接真实数据与模型。所有材料、判断、数值为虚构演示。综合意见不是正式审批意见。</span>
|
||||
@@ -164,53 +81,51 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
<div class="flex items-center gap-16" data-sd-id="6">
|
||||
<span class="flex items-center gap-4" data-sd-id="7">
|
||||
<iconify-icon icon="lucide:user"></iconify-icon>
|
||||
演示评审员
|
||||
</span>
|
||||
演示评审员
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Scrollable Content Area -->
|
||||
<div class="flex-1 overflow-y-auto p-32 flex gap-24 relative" data-sd-id="8">
|
||||
<!-- Left Main Column -->
|
||||
<div class="flex-1 flex flex-col gap-24" data-sd-id="9">
|
||||
<!-- Header / Title -->
|
||||
<header class="flex flex-col gap-12" data-sd-id="10">
|
||||
<div class="flex items-center gap-16" data-sd-id="11">
|
||||
<h1 class="text-[28px] font-bold leading-tight" data-sd-id="12">恒远精密设备有限公司</h1>
|
||||
<span class="bg-normal-bg text-normal-text px-12 py-4 rounded-full text-[12px] font-medium border border-normal-text/20" data-sd-id="13">项目 DEMO-026</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-24 text-[16px] text-ink-sub" data-sd-id="14">
|
||||
<span class="flex items-center gap-8" data-sd-id="15">
|
||||
<iconify-icon icon="lucide:briefcase"></iconify-icon>
|
||||
设备直租
|
||||
</span>
|
||||
<span class="flex items-center gap-8" data-sd-id="16">
|
||||
<iconify-icon icon="lucide:coins"></iconify-icon>
|
||||
融资 3,000 万元
|
||||
</span>
|
||||
<span class="flex items-center gap-8" data-sd-id="17">
|
||||
<iconify-icon icon="lucide:calendar"></iconify-icon>
|
||||
36 个月
|
||||
</span>
|
||||
<span class="flex items-center gap-8" data-sd-id="18">
|
||||
<iconify-icon icon="lucide:settings"></iconify-icon>
|
||||
装备制造
|
||||
</span>
|
||||
<span class="flex items-center gap-8" data-sd-id="15"><iconify-icon icon="lucide:briefcase"></iconify-icon>设备直租</span>
|
||||
<span class="flex items-center gap-8" data-sd-id="16"><iconify-icon icon="lucide:coins"></iconify-icon>融资 3,000 万元</span>
|
||||
<span class="flex items-center gap-8" data-sd-id="17"><iconify-icon icon="lucide:calendar"></iconify-icon>36 个月</span>
|
||||
<span class="flex items-center gap-8" data-sd-id="18"><iconify-icon icon="lucide:settings"></iconify-icon>装备制造</span>
|
||||
</div>
|
||||
</header>
|
||||
<!-- Main Judgement Hero -->
|
||||
<section class="bg-card rounded-panel p-32 shadow-card border border-border flex flex-col gap-24" data-sd-id="19">
|
||||
<div class="flex justify-between items-start" data-sd-id="20">
|
||||
<div class="flex flex-col gap-8" data-sd-id="21">
|
||||
<h2 class="text-[24px] font-bold text-ink-main" data-sd-id="22" id="real-recommendation">主审意见：补充材料后再判断</h2>
|
||||
<div class="flex flex-col gap-8 w-full max-w-3xl" data-sd-id="21">
|
||||
<!-- Added Probability Hero Area -->
|
||||
<div class="flex items-center gap-16 mb-4" id="probability-hero">
|
||||
<div class="flex items-baseline gap-6">
|
||||
<span class="text-[36px] font-bold text-primary leading-none tracking-tight" id="baseline-probability">42<span class="text-[20px]">%</span></span>
|
||||
<span class="text-[12px] text-primary bg-normal-bg px-10 py-4 rounded-full border border-normal-text/20 font-medium">审批通过概率 · 演示值</span>
|
||||
</div>
|
||||
<button class="text-[14px] text-primary hover:text-primary-hover font-medium flex items-center gap-4 px-12 py-6 rounded-button hover:bg-normal-bg transition-colors outline-none focus-visible:ring-2 focus-visible:ring-primary" id="btn-show-basis">
|
||||
<iconify-icon icon="lucide:help-circle"></iconify-icon> 查看判断依据
|
||||
</button>
|
||||
</div>
|
||||
<div class="text-[12px] text-warning-text bg-warning-bg px-12 py-8 rounded-button border border-warning-text/20 inline-flex w-fit items-center gap-6 mb-8">
|
||||
<iconify-icon class="text-[14px]" icon="lucide:info"></iconify-icon> 人工设定，仅演示交互；未经历史数据校准。目标定义：以本次材料版本提交后的首次审批通过。
|
||||
</div>
|
||||
<!-- End Probability Hero Area -->
|
||||
<h2 class="text-[24px] font-bold text-ink-main mt-4" data-sd-id="22" id="real-recommendation">主审意见：补充材料后再判断</h2>
|
||||
<p class="text-[16px] text-ink-sub max-w-2xl leading-relaxed" data-sd-id="23">
|
||||
经营现金流与回款说明存在待核实差异，建议先补齐两项关键证据，再推进评审。
|
||||
</p>
|
||||
经营现金流与回款说明存在待核实差异，建议先补齐两项关键证据，再推进评审。
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-16 items-start shrink-0" data-sd-id="24">
|
||||
<button class="h-[44px] px-24 bg-primary text-primary-text rounded-button text-[14px] font-medium transition-colors duration-160 hover:bg-primary-hover flex items-center gap-8 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary" data-sd-id="25" id="btn-generate-list">
|
||||
<iconify-icon icon="lucide:list-checks"></iconify-icon>
|
||||
生成补件清单
|
||||
</button>
|
||||
生成补件清单
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex gap-40 pt-24 border-t border-border mt-8" data-sd-id="26">
|
||||
@@ -228,22 +143,18 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- Main Content Tabs -->
|
||||
<section class="flex flex-col gap-24 flex-1" data-sd-id="36">
|
||||
<div aria-label="预审内容" class="flex items-center gap-32 border-b border-border" data-sd-id="37" role="tablist">
|
||||
<button aria-controls="panel-overview" aria-selected="true" class="pb-12 text-[16px] font-medium text-primary border-b-2 border-primary" data-sd-id="38" data-tab="overview" id="tab-overview" role="tab">综合预审</button>
|
||||
<button aria-controls="panel-experience" aria-selected="false" class="pb-12 text-[16px] font-medium text-ink-sub hover:text-ink-main transition-colors duration-160 border-b-2 border-transparent" data-sd-id="39" data-tab="experience" id="tab-experience" role="tab">历史经验</button>
|
||||
<button aria-controls="panel-simulation" aria-selected="false" class="pb-12 text-[16px] font-medium text-ink-sub hover:text-ink-main transition-colors duration-160 border-b-2 border-transparent" data-sd-id="40" data-tab="simulation" id="tab-simulation" role="tab">推进沙盘</button>
|
||||
</div>
|
||||
<!-- Tab Panel: 综合预审 -->
|
||||
<div aria-labelledby="tab-overview" class="flex flex-col gap-24" data-sd-id="41" id="panel-overview" role="tabpanel">
|
||||
<!-- Evidence Graph Placeholder -->
|
||||
<div class="bg-panel rounded-panel p-24 border border-border flex flex-col gap-16 min-h-[300px] relative overflow-hidden" data-sd-id="42">
|
||||
<h3 class="text-[14px] font-medium text-ink-main flex items-center gap-8" data-sd-id="43">
|
||||
<iconify-icon icon="lucide:git-merge"></iconify-icon>
|
||||
证据关系图
|
||||
</h3>
|
||||
<!-- Simulated Graph SVG -->
|
||||
证据关系图
|
||||
</h3>
|
||||
<div class="absolute inset-0 top-[60px] flex items-center justify-center pointer-events-none opacity-50" data-sd-id="44">
|
||||
<svg data-sd-id="45" height="100%" preserveaspectratio="xMidYMid meet" viewbox="0 0 800 200" width="100%">
|
||||
<path d="M 100 100 L 250 100 L 400 50 L 600 100" fill="none" stroke="#226A7A" stroke-dasharray="4 4" stroke-width="2"></path>
|
||||
@@ -275,11 +186,10 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
</button>
|
||||
</div>
|
||||
<div class="bg-card border-2 border-ink-main px-24 py-16 rounded-panel shadow-sm text-[16px] font-bold text-ink-main" data-sd-id="60">
|
||||
主审补件建议
|
||||
</div>
|
||||
主审补件建议
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Issues List -->
|
||||
<div class="flex flex-col gap-16" data-sd-id="61">
|
||||
<h3 class="text-[20px] font-bold text-ink-main" data-sd-id="62">关键问题核实</h3>
|
||||
<div class="bg-card rounded-panel border border-border overflow-hidden" data-sd-id="63">
|
||||
@@ -294,7 +204,7 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
<div class="flex gap-12 mt-8" data-sd-id="71">
|
||||
<button class="text-[12px] text-primary hover:text-primary-hover font-medium flex items-center gap-4" data-sd-id="72" id="btn-open-drawer-1">
|
||||
<iconify-icon icon="lucide:file-text"></iconify-icon> 查看原文与依据
|
||||
</button>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -309,7 +219,7 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
<div class="flex gap-12 mt-8" data-sd-id="80">
|
||||
<button class="text-[12px] text-primary hover:text-primary-hover font-medium flex items-center gap-4" data-sd-id="81">
|
||||
<iconify-icon icon="lucide:history"></iconify-icon> 查看历史依据
|
||||
</button>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -328,26 +238,66 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
<div class="condition-grid"><div><strong>适用条件</strong><p>客户结构稳定，回款与应收记录可逐笔匹配。</p></div><div><strong>例外边界</strong><p>收入集中、关联回款未穿透或材料真实性未核实。</p></div></div>
|
||||
<div class="notice">条件相似不等于结论相同。当前项目仍缺银行流水与权属核验。</div>
|
||||
</section>
|
||||
<!-- Updated Simulation Tab -->
|
||||
<section aria-labelledby="tab-simulation" class="proto-panel" hidden="" id="panel-simulation" role="tabpanel">
|
||||
<div class="section-eyebrow">SCENARIO / 条件推演</div><h2>补齐证据之后，会发生什么？</h2>
|
||||
<div class="notice">模拟结果，不改变真实项目。以下仅假设证据真实且完成核验。</div>
|
||||
<p class="muted">选择准备补充的材料，比较哪些争议可能得到回应。</p>
|
||||
<div class="section-eyebrow">SCENARIO / 条件推演</div>
|
||||
<h2>补齐证据之后，审批概率如何变化？</h2>
|
||||
<div class="notice">模拟结果，不改变真实项目。以下仅假设证据真实且完成核验；补件也可能发现新风险，真实概率未必上升，仍需人工复核。</div>
|
||||
<div class="flex flex-col lg:flex-row gap-24 mt-24 mb-24">
|
||||
<div class="flex-1 flex flex-col gap-12">
|
||||
<p class="muted mb-8">选择准备补充的材料，观察演示概率变化：</p>
|
||||
<label class="scenario-choice"><input id="assume-bank" type="checkbox"/> <span><strong>补充近六个月银行流水</strong><small>假设逐笔匹配后支持账期变化解释</small></span></label>
|
||||
<label class="scenario-choice"><input id="assume-title" type="checkbox"/> <span><strong>补充设备权属证明</strong><small>假设合同、发票与设备清单一致且经核验</small></span></label>
|
||||
<button class="primary-button" id="run-simulation">运行模拟</button><p aria-live="polite" class="muted" id="simulation-feedback"></p>
|
||||
<div class="condition-grid" hidden="" id="simulation-comparison"><div><small>真实预审 · 保持不变</small><h3>2 项待核实</h3><p>补充材料后再判断</p></div><div><small>模拟情景 · 假设成立时</small><h3 id="sim-remaining"></h3><p id="sim-explanation"></p><strong>仍需人工复核</strong></div></div>
|
||||
<button class="text-action" data-tab="overview">← 返回真实预审</button>
|
||||
</div>
|
||||
<div aria-live="polite" class="flex-1 bg-panel border border-border rounded-panel p-24 flex flex-col justify-center">
|
||||
<div class="flex justify-between items-end mb-16">
|
||||
<div>
|
||||
<div class="text-[12px] text-ink-mute mb-8">当前基线 (演示值)</div>
|
||||
<div class="text-[24px] font-bold text-ink-main leading-none">42%</div>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<div class="text-[12px] text-ink-mute mb-8">所选情景 (演示值)</div>
|
||||
<div class="flex items-baseline gap-8 justify-end">
|
||||
<span class="text-[36px] font-bold text-primary leading-none tracking-tight" id="sim-prob-val">42%</span>
|
||||
<span class="text-[14px] font-bold text-normal-text bg-normal-bg px-8 py-2 rounded-full opacity-0 transition-opacity duration-200" id="sim-prob-delta">+0 百分点</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-12">
|
||||
<div class="flex items-center gap-12">
|
||||
<span class="text-[12px] text-ink-mute w-[32px] shrink-0 text-right">基线</span>
|
||||
<div class="flex-1 h-[8px] bg-border rounded-full overflow-hidden">
|
||||
<div class="h-full bg-ink-mute rounded-full" style="width: 42%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-12">
|
||||
<span class="text-[12px] text-ink-mute w-[32px] shrink-0 text-right">模拟</span>
|
||||
<div class="flex-1 h-[8px] bg-border rounded-full overflow-hidden">
|
||||
<div class="h-full bg-primary rounded-full transition-all duration-200 ease-out" id="sim-prob-bar" style="width: 42%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-[12px] text-warning-text mt-16 flex items-center justify-center gap-4">
|
||||
<iconify-icon icon="lucide:info"></iconify-icon> 人工设定，仅演示交互；未经历史数据校准
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button class="primary-button" id="run-simulation">查看概率与判断依据</button>
|
||||
<p aria-live="polite" class="muted mt-12" id="simulation-feedback">概率、原因与待核实事项随勾选即时更新。</p>
|
||||
<div aria-live="polite" class="condition-grid mt-16" id="simulation-comparison">
|
||||
<div><small>真实预审 · 保持不变</small><h3>2 项待核实</h3><p>补充材料后再判断</p></div>
|
||||
<div><small>模拟情景 · 假设成立时</small><h3 id="sim-remaining"></h3><p id="sim-explanation"></p><strong>仍需人工复核</strong></div>
|
||||
</div>
|
||||
<button class="text-action mt-24 block" data-tab="overview">← 返回真实预审</button>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
<!-- Right Sidebar (Action Panel) -->
|
||||
<aside class="w-[320px] shrink-0 flex flex-col gap-24" data-sd-id="82">
|
||||
<!-- Next Steps Action Card -->
|
||||
<div class="bg-card rounded-panel p-24 border border-border shadow-card flex flex-col gap-16" data-sd-id="83">
|
||||
<h3 class="text-[16px] font-bold text-ink-main flex items-center gap-8" data-sd-id="84">
|
||||
<iconify-icon icon="lucide:arrow-right-circle"></iconify-icon>
|
||||
下一步行动
|
||||
</h3>
|
||||
下一步行动
|
||||
</h3>
|
||||
<div class="flex flex-col gap-12" data-sd-id="85">
|
||||
<label class="flex items-start gap-12 p-12 bg-panel rounded-button border border-border cursor-pointer hover:border-primary transition-colors" data-sd-id="86">
|
||||
<span class="text-primary text-[14px] font-bold shrink-0">1</span>
|
||||
@@ -366,10 +316,9 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
</div>
|
||||
<button class="w-full h-[44px] mt-8 bg-card border border-primary text-primary rounded-button text-[14px] font-medium transition-colors duration-160 hover:bg-primary/5 flex items-center justify-center gap-8 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary" data-sd-id="96">
|
||||
<iconify-icon icon="lucide:play"></iconify-icon>
|
||||
模拟补件 (沙盘)
|
||||
</button>
|
||||
模拟补件 (沙盘)
|
||||
</button>
|
||||
</div>
|
||||
<!-- Model Config Card -->
|
||||
<div class="bg-panel rounded-panel p-24 border border-border flex flex-col gap-16" data-sd-id="97">
|
||||
<div class="flex justify-between items-center" data-sd-id="98">
|
||||
<h3 class="text-[14px] font-medium text-ink-main" data-sd-id="99">专项核查模型</h3>
|
||||
@@ -392,8 +341,8 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
</label>
|
||||
</div>
|
||||
<p aria-live="polite" class="text-[12px] text-ink-mute mt-4 border-t border-border pt-12" data-sd-id="111" id="model-status">
|
||||
仅演示。无真实模型请求。主审仍可基于证据给出有限意见。
|
||||
</p>
|
||||
仅演示。无真实模型请求。主审仍可基于证据给出有限意见。
|
||||
</p>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
@@ -404,28 +353,94 @@ body [data-sd-id="60"]{min-width:112px;max-width:none;white-space:nowrap;text-al
|
||||
<section aria-labelledby="evidence-source-tab" id="evidence-source" role="tabpanel"><p class="muted" id="source-location">回款说明.pdf · 第3页 · 虚构演示</p><blockquote id="source-quote">主要客户账期延长，预计下一季度集中回款。</blockquote><div class="notice" id="source-gap">尚未提供对应银行流水，不能仅凭解释确认回款。</div><p class="muted">来源可定位不代表材料真实性已经核验。</p></section>
|
||||
<section aria-labelledby="evidence-basis-tab" hidden="" id="evidence-basis" role="tabpanel"><h3>从解释到判断，仍缺一环</h3><p id="basis-copy">现有说明提出了账期变化的解释，但需要银行流水与应收账龄交叉核验。专项判断不能替代主审综合意见。</p><h3>建议下一步</h3><p id="basis-next">补充近六个月银行流水，逐笔匹配主要客户回款。</p></section>
|
||||
</dialog>
|
||||
<!-- NEW: Basis Drawer -->
|
||||
<dialog aria-labelledby="basis-title" class="evidence-dialog" id="basis-dialog">
|
||||
<header class="dialog-header">
|
||||
<div>
|
||||
<div class="section-eyebrow">BASIS / 判断依据</div>
|
||||
<h2 id="basis-title">为什么是这个判断</h2>
|
||||
</div>
|
||||
<button aria-label="关闭依据抽屉" class="close-button" data-close="basis-dialog">×</button>
|
||||
</header>
|
||||
<div class="p-24 overflow-y-auto" style="height:calc(100vh - 90px)">
|
||||
<div class="notice mb-24">当前基线 42% 来自人工设定的原型情景表，非模型计算、非历史统计。以下展示未来的追溯结构，不构成数字的计算来源。</div><div class="notice" id="demo-probability-source">演示情景表：无假设 42%；流水核验支持解释 58%；权属核验一致 51%；两者同时成立 64%。组合结果单独设定，不能把增幅简单相加。</div>
|
||||
<div class="flex flex-col gap-24">
|
||||
<div>
|
||||
<h3 class="text-[16px] font-bold text-ink-main mb-12 flex items-center gap-8"><iconify-icon icon="lucide:database"></iconify-icon> 1. 状态与数据卡</h3>
|
||||
<ul class="checklist">
|
||||
<li><strong>现金流 / 回款</strong> <span class="text-ink-mute text-[12px]">DC-CASH · v1.2（演示）</span><p>发现待核实差异，无法确认对应关系。</p></li>
|
||||
<li><strong>设备权属</strong> <span class="text-ink-mute text-[12px]">DC-TITLE · v1.0（演示）</span><p>品名存在部分不符，底层资产真实权属待确认。</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-[16px] font-bold text-ink-main mb-12 flex items-center gap-8"><iconify-icon icon="lucide:cpu"></iconify-icon> 2. 技能与规则 (Skill Trace)</h3>
|
||||
<ul class="checklist">
|
||||
<li><strong>回款交叉核验</strong> <span class="text-ink-mute text-[12px]">SKILL-04 · v1.0（演示）</span><p>状态：待核实。缺少对应时间段银行流水，不能判定核验通过或不通过。</p></li>
|
||||
<li><strong>权属一致性比对</strong> <span class="text-ink-mute text-[12px]">SKILL-09 · v1.0（演示）</span><p>发现发票与清单异常。</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-[16px] font-bold text-ink-main mb-12 flex items-center gap-8"><iconify-icon icon="lucide:history"></iconify-icon> 3. 历史经验参考</h3>
|
||||
<div class="bg-panel p-16 rounded-panel border border-border">
|
||||
<div class="font-medium text-[14px] text-ink-main mb-8">案例 H-018 适用与例外</div>
|
||||
<p class="text-[13px] text-ink-sub leading-relaxed mb-8">适用条件：客户结构稳定且回款可逐笔匹配。<br/>例外：收入集中或关联回款未穿透。</p>
|
||||
<div class="text-[13px] text-warning-text bg-warning-bg p-8 rounded-button border border-warning-text/20">当前项目：尚未满足逐笔匹配证据条件，无法直接应用条件推进。</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-[16px] font-bold text-ink-main mb-12 flex items-center gap-8"><iconify-icon icon="lucide:shield-alert"></iconify-icon> 4. 硬性规则核查</h3>
|
||||
<p class="text-[14px] text-ink-sub">RULE-01 · v1.0（演示）：权属证据不足，规则状态待核实。尚未确认阻断，不代表红线核查已经通过。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</dialog>
|
||||
<dialog aria-labelledby="checklist-title" class="center-dialog" id="checklist-dialog"><header class="dialog-header"><div><div class="section-eyebrow">NEXT ACTION / 演示清单</div><h2 id="checklist-title">项目补件清单</h2></div><button aria-label="关闭补件清单" class="close-button" data-close="checklist-dialog">×</button></header><ol class="checklist"><li><strong>近六个月银行流水与应收账龄</strong><p>标注主要客户逐笔回款，说明与合同账期的对应关系。</p></li><li><strong>设备权属材料</strong><p>提供采购合同、发票和设备清单，并解释品名差异。</p></li></ol><div class="notice">DEMO-026 · 虚构演示，未发送至任何业务系统。</div><button class="primary-button" id="copy-checklist">复制清单</button><p aria-live="polite" id="copy-status"></p></dialog>
|
||||
<dialog aria-labelledby="validation-title" class="center-dialog" id="validation-dialog"><header class="dialog-header"><div><div class="section-eyebrow">VALIDATION / 验证计划</div><h2 id="validation-title">待开展脱敏盲测</h2></div><button aria-label="关闭验证计划" class="close-button" data-close="validation-dialog">×</button></header><p>先冻结样本和预测，再揭示专家参考意见。当前没有真实验证结果。</p><ol class="checklist"><li>基础预审：不使用历史经验</li><li>经验增强：主审结合已审核经验</li><li>专项增强：分别验证本地模型与 Jev（可选）</li></ol><div class="notice">关注重大问题漏检、无依据结论、有效补件与耗时。阈值在试点前约定。</div></dialog>
|
||||
<script>
|
||||
(()=>{
|
||||
const $=s=>document.querySelector(s),all=s=>[...document.querySelectorAll(s)],sd=n=>$('[data-sd-id="'+n+'"]');
|
||||
let active='overview'; const openers=new WeakMap();
|
||||
function showDialog(id){const d=$('#'+id);openers.set(d,document.activeElement);d.showModal();d.querySelector('button').focus();}
|
||||
all('dialog').forEach(d=>{d.addEventListener('close',()=>openers.get(d)?.focus());d.addEventListener('click',e=>{if(e.target===d){const b=d.getBoundingClientRect();if(e.clientX<b.left||e.clientX>b.right||e.clientY<b.top||e.clientY>b.bottom)d.close();}})});
|
||||
all('[data-close]').forEach(b=>b.onclick=()=>$('#'+b.dataset.close).close());
|
||||
function tab(name){if(name==='validation'){showDialog('validation-dialog');return;}if(!['overview','experience','simulation'].includes(name))return;active=name;all('[role=tabpanel][id^="panel-"]').forEach(p=>p.hidden=p.id!=='panel-'+name);all('[role=tab][data-tab]').forEach(b=>{const selected=b.dataset.tab===name;b.setAttribute('aria-selected',selected);b.tabIndex=selected?0:-1;b.classList.toggle('text-primary',selected);b.classList.toggle('border-primary',selected);b.classList.toggle('border-transparent',!selected)});all('[data-nav]').forEach(a=>a.classList.toggle('is-active',a.dataset.nav===name));$('#prototype-navigation').classList.remove('mobile-open');$('#mobile-menu').setAttribute('aria-expanded','false');}
|
||||
all('[data-tab]').forEach(b=>b.onclick=()=>tab(b.dataset.tab));all('[data-nav]').forEach(a=>a.onclick=e=>{e.preventDefault();tab(a.dataset.nav)});
|
||||
all('[role=tab][data-tab]').forEach((b,i)=>b.addEventListener('keydown',e=>{if(!['ArrowLeft','ArrowRight','Home','End'].includes(e.key))return;e.preventDefault();const tabs=all('[role=tab][data-tab]');const j=e.key==='Home'?0:e.key==='End'?2:(i+(e.key==='ArrowRight'?1:2))%3;tabs[j].click();tabs[j].focus()}));
|
||||
$('#mobile-menu').onclick=()=>{const on=$('#prototype-navigation').classList.toggle('mobile-open');$('#mobile-menu').setAttribute('aria-expanded',on)};
|
||||
function evidence(kind='current'){const history=kind==='history';$('#evidence-title').textContent=history?'历史回款证据示例':'回款说明与判断依据';$('#source-location').textContent=history?'历史案例 H-018 · 补件记录 · 虚构演示':'回款说明.pdf · 第3页 · 虚构演示';$('#source-quote').textContent=history?'历史示例中，主要客户实际回款与应收明细逐笔匹配。':'主要客户账期延长，预计下一季度集中回款。';$('#source-gap').textContent=history?'仅为说明经验形成过程的虚构材料，不能替代当前项目核查。':'尚未提供对应银行流水，不能仅凭解释确认回款。';$('#basis-copy').textContent=history?'历史案例补充证据支持当时的解释，适用前提是客户结构稳定且回款可逐笔匹配。当前项目尚未满足同样的证据条件。':'现有说明提出了账期变化的解释，但需要银行流水与应收账龄交叉核验。专项判断不能替代主审综合意见。';$('#evidence-source-tab').click();showDialog('evidence-dialog');}
|
||||
['node-1','node-2','node-3','node-4','btn-open-drawer-1'].forEach(id=>$('#'+id).onclick=()=>evidence());all('[data-open-evidence]').forEach(b=>b.onclick=()=>evidence(b.dataset.openEvidence));
|
||||
all('[data-evidence-tab]').forEach(b=>b.onclick=()=>{all('[data-evidence-tab]').forEach(x=>x.setAttribute('aria-selected',x===b));$('#evidence-source').hidden=b.dataset.evidenceTab!=='source';$('#evidence-basis').hidden=b.dataset.evidenceTab!=='basis'});
|
||||
$('#btn-generate-list').onclick=()=>showDialog('checklist-dialog');sd(81).onclick=()=>tab('experience');sd(96).onclick=()=>{tab('simulation');$('#assume-bank').focus()};sd(100).onclick=()=>showDialog('validation-dialog');
|
||||
all('input[name=model]').forEach(r=>r.onchange=()=>{const off=r.value==='off';$('#model-status').textContent=off?'专项核查已关闭。主审仍可基于证据与经验给出有限意见。':'本地开源模型（演示）。无真实模型请求；主审负责综合预审意见。';sd(56).textContent=off?'未执行':'不足';sd(55).textContent=off?'专项核查':'专项支持'});
|
||||
$('#run-simulation').onclick=()=>{const count=Number($('#assume-bank').checked)+Number($('#assume-title').checked);if(!count){$('#simulation-feedback').textContent='请至少选择一项假设补件。';$('#simulation-comparison').hidden=true;return;}$('#simulation-feedback').textContent='模拟完成 · 假设证据真实且完成核验，未修改真实项目。';$('#sim-remaining').textContent=(2-count)+' 项仍待核实（模拟）';$('#sim-explanation').textContent=count===2?'两项争议在假设下得到回应，不代表已获批准。':'仅所选事项在假设下得到回应，其余证据仍需补充。';$('#simulation-comparison').hidden=false;};
|
||||
all('#panel-simulation input').forEach(x=>x.onchange=()=>{$('#simulation-comparison').hidden=true;$('#simulation-feedback').textContent='假设已修改，请重新运行模拟。'});
|
||||
$('#copy-checklist').onclick=async()=>{const text='DEMO-026 演示补件清单\n1.近六个月银行流水及应收账龄，逐笔匹配主要客户回款。\n2.设备采购合同、发票和清单，解释品名差异。';try{await navigator.clipboard.writeText(text);$('#copy-status').textContent='演示清单已复制。';}catch{$('#copy-status').textContent='浏览器未允许复制，请选择上方清单文字手动复制。'}};
|
||||
tab('overview');
|
||||
})();
|
||||
</script></div>
|
||||
</body></html>
|
||||
(()=>{
|
||||
const $=s=>document.querySelector(s),all=s=>[...document.querySelectorAll(s)],sd=n=>$('[data-sd-id="'+n+'"]');
|
||||
let active='overview'; const openers=new WeakMap();
|
||||
function showDialog(id){const d=$('#'+id);openers.set(d,document.activeElement);d.showModal();d.querySelector('button').focus();}
|
||||
all('dialog').forEach(d=>{d.addEventListener('close',()=>openers.get(d)?.focus());d.addEventListener('click',e=>{if(e.target===d){const b=d.getBoundingClientRect();if(e.clientX<b.left||e.clientX>b.right||e.clientY<b.top||e.clientY>b.bottom)d.close();}})});
|
||||
all('[data-close]').forEach(b=>b.onclick=()=>$('#'+b.dataset.close).close());
|
||||
function tab(name){if(name==='validation'){showDialog('validation-dialog');return;}if(!['overview','experience','simulation'].includes(name))return;active=name;all('[role=tabpanel][id^="panel-"]').forEach(p=>p.hidden=p.id!=='panel-'+name);all('[role=tab][data-tab]').forEach(b=>{const selected=b.dataset.tab===name;b.setAttribute('aria-selected',selected);b.tabIndex=selected?0:-1;b.classList.toggle('text-primary',selected);b.classList.toggle('border-primary',selected);b.classList.toggle('border-transparent',!selected)});all('[data-nav]').forEach(a=>a.classList.toggle('is-active',a.dataset.nav===name));$('#prototype-navigation').classList.remove('mobile-open');$('#mobile-menu').setAttribute('aria-expanded','false');}
|
||||
all('[data-tab]').forEach(b=>b.onclick=()=>tab(b.dataset.tab));all('[data-nav]').forEach(a=>a.onclick=e=>{e.preventDefault();tab(a.dataset.nav)});
|
||||
all('[role=tab][data-tab]').forEach((b,i)=>b.addEventListener('keydown',e=>{if(!['ArrowLeft','ArrowRight','Home','End'].includes(e.key))return;e.preventDefault();const tabs=all('[role=tab][data-tab]');const j=e.key==='Home'?0:e.key==='End'?2:(i+(e.key==='ArrowRight'?1:2))%3;tabs[j].click();tabs[j].focus()}));
|
||||
$('#mobile-menu').onclick=()=>{const on=$('#prototype-navigation').classList.toggle('mobile-open');$('#mobile-menu').setAttribute('aria-expanded',on)};
|
||||
function evidence(kind='current'){const history=kind==='history';$('#evidence-title').textContent=history?'历史回款证据示例':'回款说明与判断依据';$('#source-location').textContent=history?'历史案例 H-018 · 补件记录 · 虚构演示':'回款说明.pdf · 第3页 · 虚构演示';$('#source-quote').textContent=history?'历史示例中，主要客户实际回款与应收明细逐笔匹配。':'主要客户账期延长，预计下一季度集中回款。';$('#source-gap').textContent=history?'仅为说明经验形成过程的虚构材料，不能替代当前项目核查。':'尚未提供对应银行流水，不能仅凭解释确认回款。';$('#basis-copy').textContent=history?'历史案例补充证据支持当时的解释，适用前提是客户结构稳定且回款可逐笔匹配。当前项目尚未满足同样的证据条件。':'现有说明提出了账期变化的解释，但需要银行流水与应收账龄交叉核验。专项判断不能替代主审综合意见。';$('#evidence-source-tab').click();showDialog('evidence-dialog');}
|
||||
['node-1','node-2','node-3','node-4','btn-open-drawer-1'].forEach(id=>$('#'+id).onclick=()=>evidence());all('[data-open-evidence]').forEach(b=>b.onclick=()=>evidence(b.dataset.openEvidence));
|
||||
all('[data-evidence-tab]').forEach(b=>b.onclick=()=>{all('[data-evidence-tab]').forEach(x=>x.setAttribute('aria-selected',x===b));$('#evidence-source').hidden=b.dataset.evidenceTab!=='source';$('#evidence-basis').hidden=b.dataset.evidenceTab!=='basis'});
|
||||
|
||||
$('#btn-generate-list').onclick=()=>showDialog('checklist-dialog');sd(81).onclick=()=>tab('experience');sd(96).onclick=()=>{tab('simulation');$('#assume-bank').focus()};sd(100).onclick=()=>showDialog('validation-dialog');
|
||||
$('#btn-show-basis').onclick=()=>showDialog('basis-dialog');
|
||||
|
||||
all('input[name=model]').forEach(r=>r.onchange=()=>{const off=r.value==='off';$('#model-status').textContent=off?'专项核查已关闭。主审仍可基于证据与经验给出有限意见。':'本地开源模型（演示）。无真实模型请求；主审负责综合预审意见。';sd(56).textContent=off?'未执行':'不足';sd(55).textContent=off?'专项核查':'专项支持'});
|
||||
|
||||
// Artificial prototype lookup only: never writes a production probability.
|
||||
const demoScenarios = {
|
||||
'00': {demoProbability:42, remaining:'2 项仍待核实（模拟）', reason:'未选择假设。回款与设备权属证据仍有缺口，保持演示基线。'},
|
||||
'10': {demoProbability:58, remaining:'设备权属仍待核实（模拟）', reason:'假设银行流水逐笔核验后支持账期变化解释，回款不确定性减小；设备权属缺口仍在。演示变化 +16 个百分点。'},
|
||||
'01': {demoProbability:51, remaining:'实际回款仍待核实（模拟）', reason:'假设合同、发票与清单一致且经核验，权属争议得到回应；实际回款仍缺银行流水。演示变化 +9 个百分点。'},
|
||||
'11': {demoProbability:64, remaining:'两项证据缺口在假设下得到回应', reason:'假设回款与权属核验均支持项目解释。组合情景为 64%，变化 +22 个百分点；组合影响不简单相加，仍需综合复核其他风险。'}
|
||||
};
|
||||
function updateSimulation(){
|
||||
const key=Number($('#assume-bank').checked)+''+Number($('#assume-title').checked);
|
||||
const scenario=demoScenarios[key];
|
||||
$('#sim-prob-val').textContent=scenario.demoProbability+'%';
|
||||
$('#sim-prob-delta').textContent='+'+(scenario.demoProbability-42)+' 百分点';
|
||||
$('#sim-prob-delta').style.opacity='1';
|
||||
$('#sim-prob-bar').style.width=scenario.demoProbability+'%';
|
||||
$('#sim-remaining').textContent=scenario.remaining;
|
||||
$('#sim-explanation').textContent=scenario.reason;
|
||||
$('#simulation-comparison').hidden=false;
|
||||
}
|
||||
['assume-bank','assume-title'].forEach(id=>$('#'+id).addEventListener('change',updateSimulation));
|
||||
$('#run-simulation').onclick=()=>showDialog('basis-dialog');
|
||||
updateSimulation();
|
||||
$('#copy-checklist').onclick=async()=>{const text='DEMO-026 演示补件清单\n1.近六个月银行流水及应收账龄，逐笔匹配主要客户回款。\n2.设备采购合同、发票和清单，解释品名差异。';try{await navigator.clipboard.writeText(text);$('#copy-status').textContent='演示清单已复制。';}catch{$('#copy-status').textContent='浏览器未允许复制，请选择上方清单文字手动复制。'}};
|
||||
tab('overview');
|
||||
})();
|
||||
</script>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user