为layui弹窗按业务状态匹配专属皮肤：定义msg-success、msg-error、msg-warn、msg-loading四类css，严格使用body .类名 .layui-layer-content结构并加!important；js中通过状态码或映射表传入对应skin值；layer.open和layer.alert也需显式指定skin并配套css。
需要为不同业务状态（如成功、失败、警告、加载中）的Layui弹窗匹配专属视觉皮肤，避免用户对提示语义产生混淆，比如删除失败弹窗不能和提交成功共用同一套蓝底白字样式。
准备多个自定义skin类名并写好对应CSS
先在页面
注意：.layui-layer-content必须加!important，因为layer内部会内联color和background-color，不加则被覆盖。
复制以下CSS到你的样式区：
body .msg-success .layui-layer-content { background-color: #e8f5e9 !important; color: #2e7d32 !important; }
body .msg-error .layui-layer-content { background-color: #ffebee !important; color: #c62828 !important; border-left: 4px solid #d32f2f; }
body .msg-warn .layui-layer-content { background-color: #fff3cd !important; color: #856404 !important; border-left: 4px solid #ffc107; }
body .msg-loading .layui-layer-content { background-color: #e3f2fd !important; color: #1565c0 !important; }
根据业务逻辑分支调用对应skin
在JS中判断后端返回的状态码或业务标识，用if/else或switch决定传哪个skin值。
方法一：基础条件判断
假设你收到一个data对象，其中code字段表示结果：code === 0为成功，code === -1为失败，code === 1为警告。
直接在回调里写：
if (data.code === 0) { layer.msg(data.msg, { skin: 'msg-success', time: 2000 }); }
else if (data.code === -1) { layer.msg(data.msg, { skin: 'msg-error', time: 2500 }); }
else if (data.code === 1) { layer.msg(data.msg, { skin: 'msg-warn', time: 2200 }); }
方法二：用映射表统一管理（推荐）
提前定义skin映射关系，避免散落多处重复字符串：
const SKIN_MAP = {
success: 'msg-success',
error: 'msg-error',
warn: 'msg-warn',
loading: 'msg-loading'
};
调用时只需取值：layer.msg('操作完成', { skin: SKIN_MAP.success, time: 2000 });
【SKIN_MAP对象必须在所有layer.msg调用前定义，否则报错】
为layer.open和layer.alert也应用同套skin体系
layer.open支持skin参数，但必须显式传入——即使你已配置过全局layer.config({ skin: 'xxx' })，不写skin字段仍走默认皮肤。
第一步：打开详情弹窗时指定skin
layer.open({
type: 1,
title: '订单详情',
content: $('#order-detail').html(),
area: ['800px', 'auto'],
skin: 'layer-order-detail'
});
第二步：为该skin写CSS（注意选择器层级）
body .layer-order-detail .layui-layer-title { background: #1976d2; color: #fff; font-weight: bold; }
body .layer-order-detail .layui-layer-content { padding: 20px; background: #f5f9ff; }
第三步：layer.alert同样适配
layer.alert('确定要作废该合同？', {
skin: 'layer-alert-danger',
yes: function(index) { /* 执行作废 */ layer.close(index); }
});
CSS中定义body .layer-alert-danger .layui-layer-content { background-color: #ffebee !important; color: #c62828 !important; }
