fix

src/layout/index.vue

@@ -74,6 +74,9 @@ function setLayout() {
 <style lang="scss" scoped>
 @import "@/assets/styles/mixin.scss";
 @import "@/assets/styles/variables.module.scss";
+body{
+  background: #eef2f8;
+}
 .app-wrapper {
     @include clearfix;
     position: relative;

src/views/task/list/index.vue

@@ -1,19 +1,98 @@
 <template>
-  <div>
-    sss
+  <div style="padding:10px">
+    <div class="formbody">
+      <el-form :inline="true" v-model="queryparameters" class="demo-form-inline">
+         <el-form-item label="任务时间">
+           <el-date-picker
+             v-model="queryparameters.times"
+             type="daterange"
+             range-separator="到"
+             start-placeholder="开始时间"
+             end-placeholder="结束时间"
+           />
+         </el-form-item>
+          <el-form-item label="任务状态">
+            <el-select  v-model="queryparameters.status" class="m-1" placeholder="请选择" >
+             </el-select>
+         </el-form-item>
+          <el-form-item label="区属">
+            <el-select v-model="queryparameters.area" class="m-2" placeholder="请选择" >
+             </el-select>
+         </el-form-item>
+         <el-form-item>
+      <el-button type="primary" >查询</el-button>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="success" >新增</el-button>
+    </el-form-item>
+       </el-form>
+
+
+        <el-table :data="tableData" class="eltable" height="250" style="width: 100%">
+    <el-table-column prop="date" label="Date" width="180" />
+    <el-table-column prop="name" label="Name" width="180" />
+    <el-table-column prop="address" label="Address" />
+  </el-table>
+    </div>
   </div>
 </template>
-<script>
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  setup() {
+<script lang="ts" setup>
+import { defineComponent,ref,reactive } from 'vue'
 
+    const queryparameters = ref({times:"",status:"",area:""})
+    const tableData = [
+  {
+    date: '2016-05-03',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-02',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-04',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-01',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
   },
-})
+  {
+    date: '2016-05-08',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-06',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    date: '2016-05-07',
+    name: 'Tom',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+]
+
+
 </script>
 
 
-<style lang="sass" scoped>
+<style lang="scss" scoped>
+.formbody{
+  background: rgb(247, 247, 247);
+  width: 100%;
+  border-radius: 5px;
+  min-height: 90vh;
+  padding: 15px 10px;
+  .eltable{
+    border: 1px solid rgb(199, 199, 199);
+    border-radius: 5px;
+  }
+}
 
 </style>