PC-application/component/statistics/CopdServeNum/index.html

<div class="copd-record-search-box">
  <div class="copd-filter-group ui-col-1 bgc-fff" style="min-width: 900px">
    <!--=======================================================-->
    <div class="searchDiv pb20">
      <label class="c-333 c-f14">
        <el-radio v-model="radio" label="1">按查询年度：</el-radio>
        <el-select v-model="chooseYear" class="pr20 formWidth">
          <el-option v-for="(item , index) in years" :key="index" :label="item" :value="item"></el-option>
        </el-select>
      </label>
    </div>
    <!--=======================================================-->
    <div class="searchDiv pb20">
      <label class="c-333 c-f14">数据范围：</label>
      <el-select class="pr20 formWidth" v-model="rangeCode" placeholder="请选择">
        <el-option v-for="(option, index) in rangeList" :label="option.name" :value="option.code"></el-option>
      </el-select>
    </div>
    <!--=======================================================-->
    <template v-if="rangeCode!='city'">
      <div class="searchDiv pb20">
        <label class="c-333 c-f14">地区：</label>
        <el-select v-model="areaCode" style="width: 100px" class="pr10" @change="selChange(3)">
          <el-option v-for="(item , index) in areaList" :key="index" :label="item.name" :value="item.code"></el-option>
        </el-select>
      </div>
      <!--=======================================================-->
      <div class="searchDiv pb20" v-show="rangeCode!='town'&&rangeCode!='specHos'">
        <label class="c-333 c-f14">社区：</label>
        <el-select v-model="communityCode" style="width: 200px" class="pr10">
          <el-option v-for="(item , index) in communityList" :key="index" :label="item.name" :value="item.code"></el-option>
        </el-select>
      </div>
    </template>
    <!--=======================================================-->
    <div class="searchDiv pb20">
      <el-button type="primary" size="mini" @click="search">查询</el-button>
      <el-button type="success" size="mini" @click="toggle(true)">导入</el-button>
      <el-button type="ff9526" size="mini" @click="exportTable">导出</el-button>
      <span class="eliminate" @click="resetDate">清除筛选条件</span>
    </div>
    <!--=======================================================-->
  </div>
  <div class="ad-schedule-import">
    <el-dialog :destroy-on-close="true" title="导入" custom-class="schedule-import" :visible.sync="isShow" :append-to-body="true" width="400px">
      <div>
        <el-form ref="form" label-width="100px">
          <el-form-item label="居民档案">
            <el-upload action="" :before-upload="beforeUploadPic" :multiple="false" accept=".xls,.xlsx" :show-file-list="false" :file-list="fileList">
              <span class="fileName" style="color: #12b7f5">{{file? file.name : '请选择文件'}}</span>
              <el-button style="vertical-align: middle" size="small" type="primary">选择文件</el-button>
            </el-upload>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="toggle(false)">取 消</el-button>
        <el-button v-loading="loading" type="primary" @click="check">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog
      :destroy-on-close="true"
      title="导入进度"
      custom-class="schedule-import"
      :visible.sync="isProgressShow"
      :append-to-body="true"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
      width="400px">
      <div class="tc">
        <div class="mb20">{{percentage!=100? '批量处理中，请耐心等待' : success? '处理成功！' : '处理失败，请重试'}}</div>
        <el-progress v-if="percentage!=100||success" :percentage="percentage"></el-progress>
        <el-progress v-else="" status="exception" :percentage="percentage"></el-progress>
        <div class="err-list" v-if="errList&&errList.length">
          <div v-for="(item, i) in errList" :key="i" v-html="item.errorMes"></div>
        </div>
        <div class="mt20">
          <el-button v-if="percentage!=100" type="info">处理中...</el-button>
          <el-button @click="close()" v-else-if="success" type="primary">处理成功</el-button>
          <el-button @click="close(1)" v-else type="danger">重试</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
  <el-table border :data="tabledata" style="width: 100%" class="mt20" v-loading="daLoading">
    <el-table-column fixed type="index" label="序号" :width="70" align="center" v-if="tableHeader.length>0"></el-table-column>
    <el-table-column
      align="center"
      :prop="item.prop"
      :label="item.label"
      :align="item.align"
      :header-align="item.headerAlign"
      :min-width="item.width"
      v-for="(item,index) in tableHeader"
      :key="index"></el-table-column>
  </el-table>
  <div class="c-t-right mt20">
    <el-pagination
      @current-change="handleCurrentChange"
      @size-change="handleSizeChange"
      :current-page.sync="page"
      :page-size="size"
      :page-sizes="[10, 20, 50]"
      layout="total,sizes, prev, pager, next, jumper"
      :total="datatotal"></el-pagination>
  </div>
</div>