修改

src/components/UserMan/buyRecords.vue

@@ -4,19 +4,30 @@
       会员购买记录
     </div>
     <div class="content">
+      <div>
+        <div class="searchInput" style="width:230px">
+          <el-input style="display:inline-block;width:205px;height:30px" placeholder="请输入用户ID" v-model="msg.UserId"
+            size="small" @keyup.enter.native="msg.pageIndex=1,getList()" @clear="msg.pageIndex=1,getList()" 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="dataList" v-loading="loading" border style="width: 100%;margin:20px 0;color:#303133">
         <el-table-column prop="UserName" label="会员名称">
         </el-table-column>
-        <el-table-column prop="Money" label="支付金额">
+        <el-table-column prop="OrderNo" label="订单号">
+        </el-table-column>
+        <el-table-column prop="Money" label="支付金额" width="120">
         </el-table-column>
         <el-table-column prop="ExpiryDateStr" label="过期时间">
         </el-table-column>
-        <el-table-column prop="GradeName" label="等级名称">
+        <el-table-column prop="GradeName" label="等级名称" width="120">
         </el-table-column>
-        <el-table-column prop="PayState" label="支付状态">
+        <el-table-column prop="PayState" label="支付状态" width="120">
           <template slot-scope="scope">
-            <span v-if="scope.row.PayState==0">未支付</span>
-            <span v-if="scope.row.PayState==1">已支付</span>
+            <span v-if="scope.row.PayState==0" style="color:red">未支付</span>
+            <span v-if="scope.row.PayState==1" style="color:green">已支付</span>
           </template>
         </el-table-column>
         <el-table-column prop="PayTimeStr" label="支付时间">
@@ -39,6 +50,7 @@
         msg: {
           pageIndex: 1,
           pageSize: 15,
+          UserId:0
         },
         total: 0,
       };
@@ -59,6 +71,7 @@
           if (res.data.resultCode == 1) {
             this.dataList = res.data.data.pageData;
             this.total = res.data.data.count;
+            console.log(this.dataList,'data');
           } else {
             this.Info(res.data.message);
           }
@@ -72,5 +85,32 @@
 
 </script>
 <style>
+  .buyRecords .content {
+    background: #fff;
+    margin-top: 10px;
+    padding: 20px;
+    box-sizing: border-box;
+  }
+  .buyRecords .content .searchInput {
+    border: 1px solid #DCDFE6;
+    border-radius: 4px;
+  }
+
+  .buyRecords .content .searchInput .el-input__inner {
+    border: none;
+    outline: none;
+    height: 30px;
+    line-height: 30px;
+  }
+
+  .buyRecords .content .searchInput {
+    line-height: normal;
+    display: inline-table;
+    width: 100%;
+    border-collapse: separate;
+    border-spacing: 0;
+    width: 250px;
+    margin-right: 20px;
+  }
 
 </style>