Jelajahi Sumber

Merge branch 'master' of http://39.104.94.153:3000/yf_zd/second

yf_ymm 5 tahun lalu
induk
melakukan
743d94a980
1 mengubah file dengan 174 tambahan dan 33 penghapusan
  1. 174 33
      templates/backstageNet/limit/expert.html

+ 174 - 33
templates/backstageNet/limit/expert.html

@@ -10,9 +10,10 @@
     <link rel="stylesheet" href="{% static '/lib/layui/css/layui.css' %}">
     <link rel="stylesheet" href="{% static '/lib/css/reset.css' %}">
     <style>
-        body{
+        body {
             background-color: #f5f5f5;
         }
+
         .breadcrumbs {
             padding: 12px 0 12px 30px;
             border-bottom: 1px solid #dbdbdb;
@@ -21,24 +22,28 @@
         .layui-breadcrumb>* {
             font-size: 16px;
         }
-		.content{
-			padding-top: 46px;
-		}
+
+        .content {
+            padding-top: 46px;
+        }
 
         .fixedDiv {
             position: fixed;
             width: 100%;
-			top: 0;
+            top: 0;
             /* z-index: 999;
             box-shadow: 0px 3px 5px 0px #ececec;*/
-            background: #fff; 
+            background: #fff;
         }
+
         /* 专家模块 */
-        .expertGather{
+        .expertGather {
             display: flex;
             flex-wrap: wrap;
+            margin-top: 35px;
         }
-        .expertGatherItem{
+
+        .expertGatherItem {
             width: 31%;
             margin: 1%;
             box-sizing: border-box;
@@ -47,39 +52,47 @@
             position: relative;
             padding: 40px 20px 40px 45px;
         }
-        .expertGatherItem>img{
+
+        .expertGatherItem>img {
             position: absolute;
             top: -7px;
             left: -8px;
         }
-        .expertInner{
+
+        .expertInner {
             display: flex;
         }
-        .expertImg{
+
+        .expertImg {
             width: 135px;
             height: 135px;
             border: 1px solid #d3d3d3;
         }
-        .expertImg>img{
+
+        .expertImg>img {
             width: 100%;
             height: 100%;
         }
-        .expertTxt{
+
+        .expertTxt {
             flex: 1;
             margin-left: 25px;
         }
-        .expertTxt h1{
+
+        .expertTxt h1 {
             font-size: 16px;
             font-weight: 700;
             display: inline-block;
             border-bottom: 2px solid #f7304d;
             line-height: 25px;
         }
-        .expertTxt p{
+
+        .expertTxt p {
             font-size: 14px;
             line-height: 35px;
         }
-        .expertTxt .desc{
+
+        .expertTxt .desc {
             font-size: 12px;
             line-height: 26px;
             text-overflow: -o-ellipsis-lastline;
@@ -90,18 +103,55 @@
             line-clamp: 2;
             -webkit-box-orient: vertical;
             margin-bottom: 10px;
-            color:#585858;
+            color: #585858;
         }
-        .expertTxt .ctrlBtn{
+
+        .expertTxt .ctrlBtn {
             text-align: right;
         }
-        .expertTxt .ctrlBtn a{
+
+        .expertTxt .ctrlBtn a {
             background: #3f9df4;
             color: #fff;
             padding: 4px 9px;
             border-radius: 5px;
             font-size: 12px;
         }
+
+        .additional {
+            /* border: 1px solid #000; */
+            /* position: relative; */
+            /* padding: 5px 0 5px 10px; */
+        }
+
+        /* 弹框 */
+        .selectModel {
+            display: none;
+        }
+
+        .selectModel>div {
+            width: 90%;
+            margin-top: 30px;
+        }
+        .uploadImg {
+            position: absolute;
+            margin: 10px 0;
+            width: 92px;
+            height: 92px;
+            background: none;
+            border: 1px solid #b8b8b8;
+            cursor: pointer;
+        }
+        .uploadImgIcon {
+            background: url(../../static/imgs/uploadImgIcon.png) no-repeat center;
+            background-size: 80% 80%;
+        }
+
+        .rightBtn {
+            position: absolute;
+            right: 40px;
+            top: 55px;
+        }
     </style>
 </head>
 
@@ -119,6 +169,12 @@
             </div>
         </div>
 
+        <!-- 新增 -->
+        <div class="additional">
+            <button type="button" class="layui-btn  layui-btn-normal layui-btn-sm rightBtn"
+                onclick="selectModelFun('新增')">新增</button>
+        </div>
+
         <!-- 内容 -->
         <div class="expertGather">
             <div class="expertGatherItem">
@@ -130,9 +186,10 @@
                     <div class="expertTxt">
                         <h1>吴玉金教授</h1>
                         <p>简介:</p>
-                        <div class="desc">吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
+                        <div class="desc">
+                            吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
                         <div class="ctrlBtn">
-                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>  
+                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>
                             <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">发信息</a>
                         </div>
                     </div>
@@ -147,10 +204,11 @@
                     <div class="expertTxt">
                         <h1>吴玉金教授</h1>
                         <p>简介:</p>
-                        <div class="desc">吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
+                        <div class="desc">
+                            吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
                         <div class="ctrlBtn">
-                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>  
-                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">发信息</a>  
+                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>
+                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">发信息</a>
                         </div>
                     </div>
                 </div>
@@ -164,9 +222,10 @@
                     <div class="expertTxt">
                         <h1>吴玉金教授</h1>
                         <p>简介:</p>
-                        <div class="desc">吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
+                        <div class="desc">
+                            吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
                         <div class="ctrlBtn">
-                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>  
+                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>
                             <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">发信息</a>
                         </div>
                     </div>
@@ -181,9 +240,10 @@
                     <div class="expertTxt">
                         <h1>吴玉金教授</h1>
                         <p>简介:</p>
-                        <div class="desc">吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
+                        <div class="desc">
+                            吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
                         <div class="ctrlBtn">
-                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>  
+                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>
                             <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">发信息</a>
                         </div>
                     </div>
@@ -198,9 +258,10 @@
                     <div class="expertTxt">
                         <h1>吴玉金教授</h1>
                         <p>简介:</p>
-                        <div class="desc">吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
+                        <div class="desc">
+                            吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
                         <div class="ctrlBtn">
-                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>  
+                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>
                             <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">发信息</a>
                         </div>
                     </div>
@@ -215,17 +276,71 @@
                     <div class="expertTxt">
                         <h1>吴玉金教授</h1>
                         <p>简介:</p>
-                        <div class="desc">吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
+                        <div class="desc">
+                            吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授吴玉金教授</div>
                         <div class="ctrlBtn">
-                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>  
+                            <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">视频电话</a>
                             <a href="tencent://message/?uin=405204799&Site=sc.chinaz.com&Menu=yes">发信息</a>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
+
+        <!-- 筛选框 -->
+        <div id="selectModel" class="selectModel">
+            <div>
+                <form class="layui-form" action="" id="formDiv" lay-filter="newsFormDiv">
+                    <input type="hidden" name="id">
+                    <div class="layui-form-item">
+                        <label class="layui-form-label">专家名称:</label>
+                        <div class="layui-input-inline">
+                            <input type="text" name="name" required lay-verify="required" placeholder="请输入专家名称"
+                                autocomplete="off" class="layui-input">
+                        </div>
+                    </div>
+
+                    <div class="layui-form-item">
+                        <label class="layui-form-label">联系QQ:</label>
+                        <div class="layui-input-inline">
+                            <input type="text" name="curr_var" required lay-verify="required" placeholder="请输入联系的QQ号"
+                                autocomplete="off" class="layui-input">
+                        </div>
+                    </div>
+
+                    <div class="layui-form-item">
+                        <label class="layui-form-label">专家照片:</label>
+                        <div class="layui-input-inline" style="margin-top: 0; margin-bottom: 65px;">
+                            <button type="button" class="uploadImg uploadImgIcon" id="pickImg"></button>
+                            <!-- 隐藏的input -->
+                            <input type="hidden" id="img_url" name="img_url" value="" />
+                            <div class="layui-upload-list">
+                                <img class="layui-upload-img" id="demo1">
+                                <p id="demoText"></p>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="layui-form-item layui-form-text">
+                        <label class="layui-form-label">专家介绍:</label>
+                        <div class="layui-input-inline">
+                            <textarea name="content" id="editor1" lay-verify="required" placeholder="请输入介绍"
+                                class="layui-textarea"></textarea>
+                        </div>
+                    </div>
+
+                    <div class="layui-form-item">
+                        <div class="layui-input-block">
+                            <button class="layui-btn  layui-btn-normal" lay-submit lay-filter="formDemo">立即提交</button>
+                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
+                        </div>
+                    </div>
+                </form>
+            </div>
+        </div>
+
         <div>
-           <!-- <img src="{% static 'imgs/specialist/intr03.jpg'%}" alt=""> -->
+            <!-- <img src="{% static 'imgs/specialist/intr03.jpg'%}" alt=""> -->
         </div>
     </div>
 
@@ -235,5 +350,31 @@
     <script src="{% static '/js/backstageNet/common.js'%}"></script>
 
 </body>
+<script>
+    function selectModelFun() {
+        layui.use(['layer'], function () {
+            layer = layui.layer;
+            var index = layer.open({
+                type: 1,
+                title: '专家添加',
+                content: $('#selectModel'),
+                area: ['550px', '570px'],
+                cancel: function () {
+                    // 右上角关闭事件的逻辑
+                    clearForm()
+                    sessionStorage.removeItem('seelectID')
+                }
+            })
+        })
+    }
+
+    function clearForm() {
+        $('#img_url').val('');
+        $('.uploadImg').addClass('uploadImgIcon');
+        $('#demo1').removeAttr('src'); //图片链接(base64)
+        layer.closeAll(); //疯狂模式,关闭所有层
+        location.reload()
+    }
+</script>
 
 </html>