Merge branch 'HitSheep' of http://39.105.160.25:10880/post-project-ui/post-ui into HitSheep

package.json

@@ -73,7 +73,7 @@
     "eslint-plugin-vue": "7.2.0",
     "lint-staged": "10.5.3",
     "runjs": "4.4.2",
-    "sass": "1.32.13",
+    "sass": "^1.32.13",
     "sass-loader": "10.1.1",
     "script-ext-html-webpack-plugin": "2.1.5",
     "svg-sprite-loader": "5.1.1",

src/views/message/messageList.vue

@@ -1,9 +1,24 @@
 <template>
-  <div :class="className" :style="{height:height,width:width}" >
+  <div class="right" :style="{ height: height, width: width }">
     <div class="up">
+      <div class="up-title">🔍筛选搜索</div>
+      <div class="up-input-title">
+        消息标题:<el-input v-model="input" class="up-input" placeholder="请输入内容"></el-input>
 
+      </div>
+      
+      <div class="up-input-title-right">
+        <span class="demonstration">发布时间:</span>
+        <el-date-picker v-model="value2" type="datetimerange" class="up-input-right" :picker-options="pickerOptions" range-separator="至"
+          start-placeholder="开始日期" end-placeholder="结束日期" align="right">
+        </el-date-picker>
+      </div>
+      <div class="anniu">
+        <el-button plain>重置</el-button>
+        <el-button type="primary" plain>查询列表</el-button>
+      </div>
     </div>
-    <el-input v-model="input" placeholder="请输入内容"></el-input>
+
 
 
 
@@ -20,10 +35,42 @@
 
 </script>
 
-<style>
- .up{
+<style scoped >
+.up {
+  width: 96%;
+  height: 150px;
+  margin-top: 20px;
+  margin-left: 27px;
+  border: 1px solid #ccc;
+}
+
+.up-title {
+  margin-left: 20px;
+  margin-top: 20px;
+}
+
+.up-input {
+  width: 250px;
+  margin-left: 15px;
+}
+
+.up-input-title {
+  margin-top: 15px;
+  margin-left: 40px;
+  float: left;
+}
+.up-input-right{
+  width: 500px;
+}
+.up-input-title-right {
+  margin-left: 450px;
+  margin-top: 15px;
+  
+}
+.anniu{ 
   
 }
+
 .el-col {
     border-radius: 4px;
   }
@@ -32,4 +79,16 @@
     border-radius: 4px;
     min-height: 36px;
   }
+
+/**
+自适应
+*/
+
+.right {
+  float: none;
+  width: 100%;
+  height: 100%;
+  /* background-color: #9dc3e6; */
+}
+
 </style>