<template>
  <div class="main-contain incomeStatistics">
    <div class="position">
      <bread-crumb :crumbs='crumbs'></bread-crumb>
    </div>
    <div class="app-container">
      <div style="display: flex;justify-content: space-between;margin-bottom:10px;">
        <div>
          <el-input size="small" style="width:150px;"  v-model="keywords"
                    class="filter-item"/>
          <el-button size="small" style="margin-left:10px;" class="filter-item" type="primary" @click="searchAction">
            搜索
          </el-button>
        </div>
        <el-button size="small" type="primary" @click="dialogFormVisible = true">医保对账</el-button>
      </div>
      <el-table :data="tableData" border style="width: 100%;" :row-style="{ color: '#303133' }"
                :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}" highlight-current-row>
        <el-table-column
          prop="date"
          label="序号"
          width="60"
          align="center"
          type="index"
        >
        </el-table-column>
        <el-table-column align="center" prop="name" label="操作机构">
          <template slot-scope="scope"></template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="对账申请人">
          <template slot-scope="scope"></template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="开始日期">
          <template slot-scope="scope"></template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="结束日期">
          <template slot-scope="scope"></template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="险种类型">
          <template slot-scope="scope"></template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="对账类型">
          <template slot-scope="scope"></template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="结算笔数">
          <template slot-scope="scope"></template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="医疗费用总数">
          <template slot-scope="scope">
          </template>
        </el-table-column>
        <el-table-column align="center" prop="name" width="160" label="基本医疗基金总费用">
          <template slot-scope="scope">
          </template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="个人支付总费用">
          <template slot-scope="scope">
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 50, 100]"
        :page-size="10"
        background
        style="margin-top:20px;float: right"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"

      >
      </el-pagination>
      <el-dialog title="医保对账" :visible.sync="dialogFormVisible">
        <el-form :model="form" label-width="100px">
            <el-form-item label="时间" :label-width="formLabelWidth">
                <el-date-picker v-model="start_time" prefix-icon="el-icon-date"
                    @change="handleStartTimeChange" :editable="false" :clearable="false"
                    style="width: 200px;" type="date" placeholder="选择开始日期"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    align="right"></el-date-picker>-

                <el-date-picker v-model="end_time" prefix-icon="el-icon-date"
                    @change="handleEndTimeChange" :editable="false" :clearable="false"
                    style="width: 200px;margin-right:10px;" type="date" placeholder="选择结束日期"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    align="right"></el-date-picker>
            </el-form-item>
            <el-form-item label="险种类型" :label-width="formLabelWidth">
                <el-select v-model="value" placeholder="请选择" style="width: 200px;">
                    <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="对账类型" :label-width="formLabelWidth">
                <el-select v-model="value" placeholder="请选择" style="width: 200px;">
                    <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取 消</el-button>
            <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
        </div>
      </el-dialog>
    </div>


  </div>
</template>


<script>
  import BreadCrumb from '@/xt_pages/components/bread-crumb'
  import { getHisOrderList,getDoctorList,getExportConsumeDetailList } from '@/api/his/his'
  import { uParseTime } from '@/utils/tools'

  export default {
    components: {
      BreadCrumb
    },
    data() {
      return {
        crumbs: [
          { path: false, name: '门诊收费' },
          { path: false, name: '医保费用对照' }
        ],
        tableData: [],
        limit:10,
        page:1,
        dialogFormVisible:false
      }
    },
    methods: {
      handleSizeChange(limit){
        this.limit = limit;
      },
      handleCurrentChange(page){
        this.page = page;
      },
    },
    created() {


    }
  }
</script>
