{ "componentsTree": [ { "componentName": "Page", "id": "schema_code", "props": { "_mode": "Flowing", "style": { "minHeight": "100%", "backgroundColor": "#f5f7fb", "padding": "24px" } }, "fileName": "service_ticket_command", "state": {}, "dataSource": { "list": [] }, "css": "body {\n font-size: 14px;\n}\n", "lifeCycles": { "mounted": { "type": "JSFunction", "value": "/**action_model:visual*/function mounted() {\n \n}" } }, "methods": {}, "originCode": "", "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "isComponent": false, "fileTitle": "服务工单指挥中心", "children": [ { "componentName": "NGrid", "id": "tpl_ticket_top_grid", "props": { "cols": "1 880:12", "x-gap": 18, "y-gap": 18, "responsive": "screen", "collapsed": false, "collapsed-rows": 1, "_unsafe_MixedSetter_cols_select": "StringSetter", "style": { "marginBottom": "18px" } }, "children": [ { "componentName": "NGridItem", "id": "tpl_ticket_sla_item", "props": { "span": 7 }, "children": [ { "componentName": "NCard", "id": "tpl_ticket_sla_card", "props": { "bordered": false, "style": { "height": "100%", "borderRadius": "20px", "background": "#0f172a", "color": "#ffffff", "boxShadow": "0 20px 44px rgba(15,23,42,0.22)" } }, "children": [ { "componentName": "NText", "id": "tpl_ticket_title", "props": { "tag": "div", "children": "服务工单指挥中心", "style": { "fontSize": "28px", "fontWeight": 800, "color": "#ffffff" } } }, { "componentName": "NText", "id": "tpl_ticket_desc", "props": { "tag": "div", "children": "围绕 SLA、响应时长、积压工单和异常根因建立实时服务态势。", "style": { "marginTop": "10px", "color": "rgba(255,255,255,0.72)", "lineHeight": "22px" } } }, { "componentName": "NGrid", "id": "tpl_ticket_dark_metrics", "props": { "cols": "1 520:3", "x-gap": 12, "y-gap": 12, "responsive": "screen", "collapsed": false, "collapsed-rows": 1, "_unsafe_MixedSetter_cols_select": "StringSetter", "style": { "marginTop": "28px" } }, "children": [ { "componentName": "NGridItem", "id": "tpl_ticket_metric_a", "children": [ { "componentName": "NText", "id": "tpl_ticket_metric_a_label", "props": { "tag": "div", "children": "SLA 达成", "style": { "color": "#94a3b8" } } }, { "componentName": "NText", "id": "tpl_ticket_metric_a_value", "props": { "tag": "div", "children": "97.2%", "style": { "marginTop": "8px", "fontSize": "30px", "fontWeight": 800, "color": "#38bdf8" } } } ] }, { "componentName": "NGridItem", "id": "tpl_ticket_metric_b", "children": [ { "componentName": "NText", "id": "tpl_ticket_metric_b_label", "props": { "tag": "div", "children": "平均响应", "style": { "color": "#94a3b8" } } }, { "componentName": "NText", "id": "tpl_ticket_metric_b_value", "props": { "tag": "div", "children": "8.6 分", "style": { "marginTop": "8px", "fontSize": "30px", "fontWeight": 800, "color": "#22c55e" } } } ] }, { "componentName": "NGridItem", "id": "tpl_ticket_metric_c", "children": [ { "componentName": "NText", "id": "tpl_ticket_metric_c_label", "props": { "tag": "div", "children": "超时风险", "style": { "color": "#94a3b8" } } }, { "componentName": "NText", "id": "tpl_ticket_metric_c_value", "props": { "tag": "div", "children": "12", "style": { "marginTop": "8px", "fontSize": "30px", "fontWeight": 800, "color": "#fb923c" } } } ] } ] } ] } ] }, { "componentName": "NGridItem", "id": "tpl_ticket_funnel_item", "props": { "span": 5 }, "children": [ { "componentName": "NCard", "id": "tpl_ticket_funnel_card", "props": { "title": "工单阶段分布", "bordered": false, "style": { "height": "100%", "borderRadius": "20px", "boxShadow": "0 12px 30px rgba(24,39,75,0.08)" } }, "children": [ { "componentName": "IBarChart", "id": "tpl_ticket_bar", "props": { "labels": ["新建", "处理中", "待客户", "待验收", "已关闭"], "datasets": [ { "label": "工单数", "data": [46, 82, 31, 24, 156], "backgroundColor": "#3164f6" } ], "options": { "maintainAspectRatio": false, "plugins": { "legend": { "display": false } } }, "style": { "height": "280px" } } } ] } ] } ] }, { "componentName": "NGrid", "id": "tpl_ticket_bottom_grid", "props": { "cols": "1 920:3", "x-gap": 18, "y-gap": 18, "responsive": "screen", "collapsed": false, "collapsed-rows": 1, "_unsafe_MixedSetter_cols_select": "StringSetter" }, "children": [ { "componentName": "NGridItem", "id": "tpl_ticket_alerts", "children": [ { "componentName": "NCard", "id": "tpl_ticket_alert_card", "props": { "title": "异常根因", "bordered": false, "style": { "borderRadius": "18px", "boxShadow": "0 12px 30px rgba(24,39,75,0.08)" } }, "children": [ { "componentName": "IPieChart", "id": "tpl_ticket_reason_chart", "props": { "chartType": "pie", "labels": ["接口异常", "权限问题", "数据缺失", "人工误操作"], "datasets": [ { "label": "根因", "data": [38, 22, 25, 15], "backgroundColor": ["#ef4444", "#f97316", "#3164f6", "#10b981"], "borderWidth": 0, "hoverOffset": 6 } ], "style": { "height": "260px" } } } ] } ] }, { "componentName": "NGridItem", "id": "tpl_ticket_queue", "children": [ { "componentName": "NCard", "id": "tpl_ticket_queue_card", "props": { "title": "高优先级队列", "bordered": false, "style": { "borderRadius": "18px", "boxShadow": "0 12px 30px rgba(24,39,75,0.08)" } }, "children": [ { "componentName": "NSpace", "id": "tpl_ticket_queue_list", "props": { "vertical": true, "style": { "width": "100%" } }, "children": [ { "componentName": "NTag", "id": "tpl_ticket_queue_1", "props": { "type": "error", "bordered": false, "children": "支付回调失败 / 6 单" } }, { "componentName": "NTag", "id": "tpl_ticket_queue_2", "props": { "type": "warning", "bordered": false, "children": "客户验收阻塞 / 12 单" } }, { "componentName": "NTag", "id": "tpl_ticket_queue_3", "props": { "type": "info", "bordered": false, "children": "数据修复等待 / 9 单" } } ] } ] } ] }, { "componentName": "NGridItem", "id": "tpl_ticket_action", "children": [ { "componentName": "NCard", "id": "tpl_ticket_action_card", "props": { "title": "快捷动作", "bordered": false, "style": { "borderRadius": "18px", "boxShadow": "0 12px 30px rgba(24,39,75,0.08)" } }, "children": [ { "componentName": "NSpace", "id": "tpl_ticket_actions", "props": { "vertical": true, "style": { "width": "100%" } }, "children": [ { "componentName": "NButton", "id": "tpl_ticket_btn_1", "props": { "block": true, "type": "primary", "children": "派发给值班组" } }, { "componentName": "NButton", "id": "tpl_ticket_btn_2", "props": { "block": true, "children": "创建专项排查" } }, { "componentName": "NButton", "id": "tpl_ticket_btn_3", "props": { "block": true, "children": "导出 SLA 报告" } } ] } ] } ] } ] } ] } ], "i18n": {} }