<template>
    <div class="app-container">

        <el-form ref="queryForm" size="small" :inline="true" label-width="68px">
            <el-form-item label="模板" prop="name">
                <el-select v-model="selectedOption" ref="mySelect" size="mini" @change="handleOptionChange($event,  {
                name: '吕矿',
                id: '011702'
            },'011702','1257')" filterable
                    placeholder="请选择您要查看的模板">
                    <el-option v-for="item in depss" :key="item.id" :label="item.templateName" :value="item.id"
                        :disabled="item.disabled">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="清洗规则" prop="roleid">
                <el-select v-model="selectedRule" ref="mySelect" size="mini" @change="handleRuleChange" filterable
                    placeholder="请选择您要查看的规则">
                    <el-option v-for="iem in luckyrule" :key="iem.id" :label="iem.roleName" :value="iem.id">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="时间" prop="date">
                <el-date-picker @change="handledateChange" v-model="date" type="month" placeholder="选择月">
                </el-date-picker>
            </el-form-item>
            <el-form-item>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button type="warning" plain icon="el-icon-upload2" size="mini" @click="handleExport">导出</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-upload type="file" name="file" ref="upload" :before-upload="handleFileChange" action='' accept='.xlsx'
                    :limit="1" :file-list="fileList" :disabled="disableNextButton" :show-file-list=false>
                    <el-button plain size="mini" icon="el-icon-download" type="primary" :disabled="disableNextButton"
                        @click="rulesdate">导入</el-button>
                </el-upload>
                <el-button :plain="true" style="display: none;" @click="open4">错误</el-button>

            </el-col>
        
        </el-row>


        <!-- luckysheet容器 -->
        <div id="luckysheet" style="margin: 0px; padding: 0px; position: absolute; width: 100%; height:80vh; z-index: 0">
        </div>
        <div v-if="showMask" class="mask">
            <div class="loading-spinner"></div>
        </div>

    </div>
</template>
<script src="@/conversion/conversion"></script>
<style scoped src="./actsuppMine.css"></style>