页面修改

src/components/tradePavilion/signList.vue

+<template>
+  <div class="signList tradeactivity">
+    <div class="head-title">
+      活动报名列表
+    </div>
+    <div class="content">
+      <div>
+        <div class="searchInput" style="width:250px">
+          <el-input @keyup.enter.native="msg.pageIndex=1,getList()" @clear="msg.pageIndex=1,getList()"
+            style="display:inline-block;width:225px;height:30px" placeholder="活动名称" v-model="msg.ActivityName"
+            size="small" clearable>
+          </el-input>
+          <span @click="msg.pageIndex=1,getList()" class="el-icon-search"
+            style="color:#979dad;font-size:14px;position:relative;top:1px"></span>
+        </div>
+      </div>
+      <el-table :data="tableData" v-loading="loading" border style="width: 100%;margin:20px 0">
+        <el-table-column prop="Id" label="编号" width="100">
+        </el-table-column>
+        <el-table-column prop="ActivityName" label="活动名称">
+        </el-table-column>
+        <el-table-column prop="ActivityTypeName" label="活动类型">
+        </el-table-column>
+        <el-table-column prop="CoverImg" label="封面图">
+          <template slot-scope="scope">
+            <el-image title="点击查看大图" style="width:50px;" :src="scope.row.CoverImg"
+              :preview-src-list="scope.row.CoverList"></el-image>
+          </template>
+        </el-table-column>
+        <el-table-column prop="StartTimeStr" label="活动时间">
+          <template slot-scope="scope">
+            <span>{{scope.row.StartTimeStr}}</span><br />
+            <span>{{scope.row.EndTimeStr}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="SignStartTimeStr" label="报名时间">
+          <template slot-scope="scope">
+            <span>{{scope.row.SignStartTimeStr}}</span><br />
+            <span>{{scope.row.SignEndTimeStr}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ActivityStatusStr" label="活动状态">
+        </el-table-column>
+        <el-table-column prop="JoinNum" label="报名人数">
+          <template slot-scope="scope">
+            <el-button type="text" @click="dialogTableVisible = true,getItem(scope.row)">
+              {{scope.row.JoinNum}} 人
+            </el-button>
+          </template>
+        </el-table-column>
+        <el-table-column prop="Id" width="200" label="操作">
+          <template slot-scope="scope">
+            <el-tooltip class="item" effect="dark" content="编辑" placement="top">
+              <img @click="EditType(scope.row)" style="width:32px;height:32px" src="../../assets/img/userman/edit.png"
+                alt="">
+            </el-tooltip>
+            <el-tooltip class="item" effect="dark" content="查看报名" placement="top-start">
+              <img @click="delType(scope.row)" style="width:32px;height:32px;margin:0 10px"
+                src="../../assets/img/userman/del.png" alt="">
+            </el-tooltip>
+            <el-tooltip class="item" effect="dark" content="删除" placement="top-start">
+              <img @click="delType(scope.row)" style="width:32px;height:32px;margin:0 10px"
+                src="../../assets/img/userman/del.png" alt="">
+            </el-tooltip>
+
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination style="text-align:right" background @current-change="handleCurrentChange" :page-size="msg.pageSize"
+        :current-page.sync="msg.pageIndex" layout="total,prev, pager, next" :total="total">
+      </el-pagination>
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    data() {
+      return {
+        msg: {
+          pageIndex: 1,
+          pageSize: 10,
+        },
+        tableData: [],
+        total: 0,
+      };
+    },
+    created() {
+      this.getList();
+    },
+    mounted() {},
+    methods: {
+      getList() {
+        this.loading = true;
+        this.apipost("/api/Trade/GetCommerceConsultStaticPage", this.msg, res => {
+          this.loading = false;
+          if (res.data.resultCode == 1) {
+            this.tableData = res.data.data.pageData;
+            console.log("tableData", this.tableData);
+            this.total = res.data.data.pageCount;
+          }
+        })
+      },
+      handleCurrentChange(val) {
+        this.msg.pageIndex = val;
+        this.getList();
+      },
+    },
+  };
+
+</script>
+<style>
+  .signList .remark_name {
+    color: #888888;
+    font-size: 12px;
+    margin-left: 10px;
+    float: right;
+  }
+
+  .signList .app-image {
+    background-position: center center;
+    width: 50px;
+    height: 50px;
+    border-radius: 0%;
+    float: left;
+    margin-right: 8px;
+  }
+
+  .signList .blue {
+    color: #409EFF;
+
+  }
+
+  .signList .content .searchInput {
+    border: 1px solid #DCDFE6;
+    border-radius: 4px;
+  }
+
+  .signList .content .searchInput .el-input__inner {
+    border: none;
+    outline: none;
+    height: 30px;
+    line-height: 30px;
+  }
+
+  .signList .content .searchInput {
+    line-height: normal;
+    display: inline-table;
+    width: 100%;
+    border-collapse: separate;
+    border-spacing: 0;
+    width: 250px;
+    margin-right: 20px;
+  }
+
+  .signList .content {
+    background: #fff;
+    margin-top: 10px;
+    padding: 20px;
+    box-sizing: border-box;
+  }
+
+  .tradeactivity .el-form-item__content {
+    line-height: 0;
+  }
+
+</style>