From 04077c5f49b10e179aa4055968da135052b740fd Mon Sep 17 00:00:00 2001 From: chf <156704883@qq.com> Date: Thu, 25 Aug 2022 15:10:02 +0800 Subject: [PATCH 1/2] =?UTF-8?q?message=20=E5=A2=9E=E5=8A=A0=20empty=20?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- admin/data/message.json | 190 ++++++++++---------------- component/pear/css/module/message.css | 46 +++++++ component/pear/module/message.js | 8 ++ 3 files changed, 129 insertions(+), 115 deletions(-) diff --git a/admin/data/message.json b/admin/data/message.json index ee74bb6..7cf9263 100644 --- a/admin/data/message.json +++ b/admin/data/message.json @@ -2,129 +2,89 @@ "id": 1, "title": "通知", "children": [{ - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", - "title": "你收到了 14 份新周报", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, { - "id": 12, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png", - "title": "曲妮妮 已通过第三轮面试", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, - { - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png", - "title": "可以区分多种通知类型", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, { - "id": 12, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png", - "title": "左侧图标用于区分不同的类型", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, - { - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", - "title": "内容不要超过两行字", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - } - ] + "id": 11, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", + "title": "你收到了 14 份新周报", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }, { + "id": 12, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png", + "title": "曲妮妮 已通过第三轮面试", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }, + { + "id": 11, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png", + "title": "可以区分多种通知类型", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }, { + "id": 12, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png", + "title": "左侧图标用于区分不同的类型", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }, + { + "id": 11, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", + "title": "内容不要超过两行字", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }] }, { "id": 2, "title": "消息", "children": [{ - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", - "title": "你收到了 14 份新周报", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, { - "id": 12, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png", - "title": "曲妮妮 已通过第三轮面试", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, - { - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png", - "title": "可以区分多种通知类型", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, { - "id": 12, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png", - "title": "左侧图标用于区分不同的类型", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, - { - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", - "title": "内容不要超过两行字", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - } - ] + "id": 11, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", + "title": "你收到了 14 份新周报", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }, { + "id": 12, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png", + "title": "曲妮妮 已通过第三轮面试", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }, + { + "id": 11, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png", + "title": "可以区分多种通知类型", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }, { + "id": 12, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png", + "title": "左侧图标用于区分不同的类型", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }, + { + "id": 11, + "avatar":"https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", + "title": "内容不要超过两行字", + "context": "这是消息内容。", + "form": "就眠仪式", + "time": "刚刚" + }] }, { "id": 3, "title": "代办", - "children": [{ - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", - "title": "你收到了 14 份新周报", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, { - "id": 12, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png", - "title": "曲妮妮 已通过第三轮面试", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, - { - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png", - "title": "可以区分多种通知类型", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, { - "id": 12, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png", - "title": "左侧图标用于区分不同的类型", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - }, - { - "id": 11, - "avatar": "https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png", - "title": "内容不要超过两行字", - "context": "这是消息内容。", - "form": "就眠仪式", - "time": "刚刚" - } - ] + "children": [] } ] diff --git a/component/pear/css/module/message.css b/component/pear/css/module/message.css index 85475c6..223e79c 100644 --- a/component/pear/css/module/message.css +++ b/component/pear/css/module/message.css @@ -82,3 +82,49 @@ .pear-notice *::-webkit-scrollbar-corner { background: #f6f6f6; } + +/** 增加 empty 样式 */ +.pear-empty { + margin: 0 8px; + font-size: 14px; + line-height: 1.5715; + text-align: center; +} +.pear-empty-normal { + margin: 32px 0; + color: #00000040; +} +.pear-empty-normal .pear-empty-image { + height: 40px; +} + +.pear-empty-image { + height: 100px; + margin-bottom: 8px; +} +.pear-empty-image svg { + height: 100%; + margin: auto; +} + +.pear-empty-img-simple-g { + stroke: #d9d9d9; +} +.pear-empty-img-default-g { + fill: #fff; +} +.pear-empty-img-simple-path { + fill: #fafafa; +} +.pear-empty-img-default-path-1 { + fill: #aeb8c2; +} +.pear-empty-img-default-path-2 { + fill: url(#linearGradient-1); +} +.pear-empty-img-default-path-3 { + fill: #f5f5f7; +} +.pear-empty-img-default-path-4, .pear-empty-img-default-path-5 { + fill: #dce0e6; +} diff --git a/component/pear/module/message.js b/component/pear/module/message.js index 9a7e204..49d221d 100644 --- a/component/pear/module/message.js +++ b/component/pear/module/message.js @@ -105,6 +105,14 @@ layui.define(['table', 'jquery', 'element'], function (exports) { '
暂无数据
暂无数据