<template>
  <basic-container>
    <avue-crud 
			ref="crud"
			:before-open="beforeOpen"
			:option="option"
			:table-loading="loading"
			:data="listData"
			@on-load="onLoad"
			@refresh-change="onLoad"
			@search-change="searchChange"
			@search-reset="searchReset"
			v-model="formData"
			v-model:page="page"
			@current-change="currentChange"
			@size-change="sizeChange">
			<template #menu="{row}">
				<el-button type="primary" text icon="el-icon-view" @click="linkTo(row)">
					查看
				</el-button>
			</template>
    </avue-crud>
  </basic-container>
</template>

<script> 
  import {getList} from "@/api/finance/account";
  import {mapGetters} from "vuex";

  export default {
    data() {
      return {
				query: {},
				loading: false,
				page: {
				  pageSize: 10,
				  currentPage: 1,
				  total: 0
				},
				option: {
					height: 'auto',
					calcHeight: 32,
					index: true,
					indexLabel: '序号',
					indexWidth: 60,
					addBtn:false,
					editBtn:false,
					delBtn:false,
					menuFixed: true,
					menuWidth: 120,
					border: true,
					searchMenuSpan:6,
					searchMenuPosition: "left",
					searchGutter:0,
					searchLabelWidth:90,
					column:[
						{
							label: '运维商名称',
							prop: 'name',
							minWidth: 200,
							search:true,
						},
						{
							label: '联系人',
							prop: 'contacts',
							minWidth: 100,
						},
						{
							label: '联系方式',
							prop: 'mobile',
							minWidth: 120,
						},
						{
							label: '结算数量',
							prop: 'orderSetCount',
							minWidth: 100,
						},
						{
							label: '结算总额',
							prop: 'totalWallet',
							minWidth: 100,
						},
					],
				},
				listData: [{}],
        formData: {},
      };
    },
    created(){
			this.$route.meta.$keepAlive = true;
    },
    methods: {
			linkTo(row){
				this.$router.push({path:'/finance/settlement', query: {
          userId: row.userId,
					userName:row.name
        }});
			},
			beforeOpen(done, type) {
			  done();
			},
			onLoad() {
			  this.loading = true;
			  getList(this.page, this.query).then(res => {
			    const data = res.data.data;
			    this.page.total = data.total;
			    this.listData = data.records;
			    this.loading = false;
			  });
			},
			searchReset() {
			  this.query = {};
			  this.onLoad();
			},
			searchChange(params, done) {
			  this.query = params;
			  this.page.currentPage = 1;
			  this.onLoad();
			  done();
			},
      currentChange(currentPage){
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize){
        this.page.pageSize = pageSize;
      },   
    }
  };
</script>

<style>
</style>
