From afa5c53241ee3c091719ff54547956f6ca9e20ee Mon Sep 17 00:00:00 2001 From: a123456 <1209165801@qq.com> Date: Sat, 26 Jan 2019 17:49:27 +0800 Subject: [PATCH] Signed-off-by: a123456 <1209165801@qq.com> --- .../WEB-INF/manager/include/head-file.ftl | 8 +++++ .../manager/mweixin/metarial/index.ftl | 35 +++++++++++-------- .../static/mweixin/css/material-list.css | 31 ++++++++++++++-- .../webapp/static/mweixin/material-list.less | 29 ++++++++++++++- 4 files changed, 86 insertions(+), 17 deletions(-) diff --git a/src/main/webapp/WEB-INF/manager/include/head-file.ftl b/src/main/webapp/WEB-INF/manager/include/head-file.ftl index f181ec75..ab4b1116 100644 --- a/src/main/webapp/WEB-INF/manager/include/head-file.ftl +++ b/src/main/webapp/WEB-INF/manager/include/head-file.ftl @@ -28,6 +28,9 @@ + + + @@ -38,4 +41,9 @@ ms.base = "http://192.168.0.54:82"; ms.manager = "http://192.168.0.54:82/apis"; + //图片懒加载 + Vue.use(VueLazyload, { + error: ms.base + '/images/ic_image_deault.png', + loading: ms.base + '/images/ic_image_deault.png', + }) \ No newline at end of file diff --git a/src/main/webapp/WEB-INF/manager/mweixin/metarial/index.ftl b/src/main/webapp/WEB-INF/manager/mweixin/metarial/index.ftl index 77204326..76a81a8a 100644 --- a/src/main/webapp/WEB-INF/manager/mweixin/metarial/index.ftl +++ b/src/main/webapp/WEB-INF/manager/mweixin/metarial/index.ftl @@ -24,20 +24,20 @@ 查询 - +
-
+
-
- - -

+
+ + +

-
- - +
+ +
@@ -60,11 +60,18 @@ value1: '全部图片', value2: '', materialList: [{ - date: '12月27日', - title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...', - img: '', - det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价，后置摄像头后置莱卡散射，12000万亿像素（光脚，1/1.6光圈）+1200万像素（超广角），......' - }], + date: '12月27日', + title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...', + img: '', + det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价，后置摄像头后置莱卡散射，12000万亿像素（光脚，1/1.6光圈）+1200万像素（超广角），......' + }, + { + date: '12月27日', + title: 'HUAWEI Mate 20 6GB+64GB 全网最低价...', + img: '', + det: '传播名HUAWEI Mate 20 6GB+64GB 全网最低价，后置摄像头后置莱卡散射，12000万亿像素（光脚，1/1.6光圈）+1200万像素（超广角），......' + } + ], }, methods: {}, mounted: function() {} diff --git a/src/main/webapp/static/mweixin/css/material-list.css b/src/main/webapp/static/mweixin/css/material-list.css index aa2ea762..3fa041a9 100644 --- a/src/main/webapp/static/mweixin/css/material-list.css +++ b/src/main/webapp/static/mweixin/css/material-list.css @@ -101,6 +101,33 @@ textarea::-webkit-input-placeholder { width: calc(100% - 140px); } .ms-admin-material-list { - margin: 15px; - padding: 10px; + background: #fff; + margin: 12px; + padding: 14px; + display: flex; + flex-wrap: wrap; +} +.ms-admin-material-list .ms-admin-material-item { + margin: 0 24px 0 0; + padding: 0 10px; + width: 230px; + display: flex; + flex-direction: column; + border: 1px solid #e6e6e6; + border-radius: 4px; +} +.ms-admin-material-list .ms-admin-material-item .head { + border-bottom: 1px solid #e6e6e6; + padding: 10px 0; +} +.ms-admin-material-list .ms-admin-material-item .body { + display: flex; + flex-direction: column; +} +.ms-admin-material-list .ms-admin-material-item .footer { + display: flex; + padding: 14px 0; +} +.ms-admin-material-list .ms-admin-material-item .footer i { + margin: auto; } diff --git a/src/main/webapp/static/mweixin/material-list.less b/src/main/webapp/static/mweixin/material-list.less index 9fc5ee0f..b4139988 100644 --- a/src/main/webapp/static/mweixin/material-list.less +++ b/src/main/webapp/static/mweixin/material-list.less @@ -1,4 +1,31 @@ @import "../ms-admin/4.7.0/less/app.less"; .ms-admin-material-list { - .ms-margin-padding(15px, 10px); + background: #fff; + .ms-margin-padding(12px, 14px); + display: flex; + flex-wrap: wrap; + //单个素材 + .ms-admin-material-item { + .ms-margin-padding(0 24px 0 0, 0 10px); + width: 230px; + display: flex; + flex-direction: column; + border: 1px solid #e6e6e6; + border-radius: 4px; + .head { + border-bottom: 1px solid #e6e6e6; + padding: 10px 0; + } + .body { + display: flex; + flex-direction: column; + } + .footer { + display: flex; + padding: 14px 0; + i { + margin: auto; + } + } + } } \ No newline at end of file