wanzb_admin/src/views/data/fundInOut.vue

<style lang="scss">
.del {
  display: inline-block;
  vertical-align: top;
  font-size: 28px;
  font-weight: 500;
  margin-left: 10px;
  color: #000;
  cursor: pointer;
}
</style>
<template>
  <section class="content data">
    <h4>资金出入</h4>
    <el-divider></el-divider>
    <el-form label-width="80px" class="filter-form">
      <el-row>
        <el-col :span="5">
          <el-form-item label="选手名字">
            <el-input
              clearable
              @clear="getData()"
              v-model="queryParams.username"
              placeholder="请输入选手名字/代码"
              size="mini"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="持股日期">
            <el-date-picker
              v-model="queryParams.stock_date"
              type="date"
              placeholder="选择日期"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              size="mini"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item style="margin-left:10px;" label-width="10">
            <el-button type="primary" @click="getData" size="mini">筛选</el-button>
            <el-button type="normal" @click="queryParams={},getData()" size="mini">重置</el-button>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="10">
        <el-col :span="6"></el-col>
      </el-row>
    </el-form>
    <el-table :data="list" height="55vh" style="width: 100%;margin-top:10px;" v-loading="loading">
      <el-table-column prop="username" label="选手" />
      <el-table-column prop="usercode" label="代码" />
      <el-table-column prop="stock_date" label="资金出入日期" width="150" />
      <el-table-column prop="fundin" label="转入资金(万元)" />
      <el-table-column prop="fundout" label="转出资金(万元)" />
      <el-table-column header-align="center" align="center" prop="prop" label="账号截图">
        <template slot-scope="scope">
          <el-image
              style="width: 100px; height: 100px"
              :src="scope.row.account_img"
              fit="fit"
              :preview-src-list="[scope.row.account_img]"
              ></el-image>
        </template>
      </el-table-column>
      <el-table-column prop="ctime" label="创建时间" width="150" />
      <el-table-column prop="date" label="操作" fixed="right" width="220">
        <template slot-scope="scope">
          <el-button @click="del(scope.row.id)" size="mini" type="danger">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <Page
            ref="pageButton"
            :current="form.page"
            :page_size="form.page_size"
            :total="total"
            @pageChange="gopage"
        />
  </section>
</template>
<script>
import Page from "../../components/Page";
export default {
  components: {
    Page
  },
  data() {
    return {
      loading: false,
      queryParams: {
        match_id: 0,
        page: 1,
        stock_date: this.getNowDate()
      },
      form: {
        stock_date: this.getNowDate()
      },
      form1: {},
      list: [{}, {}],
      total: 0
    };
  },
  methods: {
    getNowDate() {
      var y = new Date().getFullYear();
      var m = Number(new Date().getMonth() + 1);
      var d = new Date().getDate();
      m = m > 9 ? m : "0" + m;
      d = d > 9 ? d : "0" + d;
      return y + "-" + m + "-" + d;
    },
    del(id) {
      this.$confirm("确定删除吗?", "提示", {
        type: "warning"
      }).then(() => {
        this.$api.delFundInOut({ id: id }).then(res => {
          this.$message({
            message: "删除成功",
            type: "success"
          });
          this.getData();
        });
      });
    },
    gopage(size) {
      if (size) {
        this.queryParams.page_size = size;
      }
      this.queryParams.page = this.$refs.pageButton.page;
      this.getData();
    },
    getData() {
      this.loading = true;
      this.$api.getFundInOutList(this.queryParams).then(res => {
        this.list = res.data.data.list;
        this.total = res.data.data.total;
        this.loading = false;
      });
    }
  },
  created() {
    this.getData();
  }
};
</script>