platformFront/src/components/admin/OrganizationInfo.vue

<!-- 机构信息 By_liucf -->
<template>
    <div>
        <crumbs title="机构信息">
            <el-form :inline="true" class="demo-form-inline">
                <el-form-item label="注册时间：">
                    <el-date-picker v-model="time" size="mini" type="daterange" value-format="yyyy-MM-dd HH:mm:ss" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']"></el-date-picker>
                </el-form-item>
                <el-form-item label="机构名称：">
                    <el-input size="mini" v-model="name" clearable placeholder="机构名称" @keyup.enter.native="getSearch"></el-input>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button size="mini" @click="getSearch">确认</el-button>
                    <el-button size="mini" type="warning" @click="addOrganization">添加机构</el-button>
                    <el-button size="mini" type="primary" @click="exportOrganizeInfo">导出</el-button>
                </el-form-item>
            </el-form>
        </crumbs>
        <div class="contents">
            <el-table :data="list"
                      border
                      style="width: 100%">
                <el-table-column
                        type="index"
                        :index="indexMethod"
                        label="编号"
                        width="60">
                </el-table-column>
                <el-table-column
                        prop="orgGmtCreate"
                        label="注册时间"
                        :show-overflow-tooltip="true">
                </el-table-column>
                <el-table-column
                        prop="orgName"
                        label="注册机构">
                </el-table-column>
                <el-table-column
                        prop="orgPrincipal"
                        label="机构负责人">
                </el-table-column>
                <el-table-column
                        prop="orgType"
                        label="机构属性"
                        :formatter="formatType">
                </el-table-column>
                <el-table-column
                        prop="orgAddress"
                        label="机构地址">
                </el-table-column>
                <el-table-column
                        prop="linkman"
                        label="超管名称">
                </el-table-column>
                <el-table-column
                        fixed="right"
                        label="操作"
                        width="100">
                    <template slot-scope="scope">
                        <el-button v-if="scope.row.authStatus==1" type="text" size="small" @click="handleModifined(scope.$index, scope.row)">修改</el-button>
                        <el-button v-else type="text" size="small" style="color: #c9c9c9;cursor: text;">修改</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination v-if="total>pageSize"
                           :current-page.sync="currentPage"
                           @current-change="currentChange"
                           background
                           :page-size="pageSize"
                           layout="total,prev, pager, next, jumper"
                           :total="total">
            </el-pagination>
        </div>

    </div>
</template>

<script>
  import api from '@api/admin.js';
  import utils from '@api/utils.js';
  export default {
    name: 'OrganizationInfo',
    data: function () {
      return {
        list: [],
        status: [],
        cacheData: {},
        cachePage: null,
        currentPage: 1,
        pageSize: 10,
        total: 0,
        time:'',
        name:'',
        includedComponents: "OrganizationInfo"
      }
    },
    created() {
      let page = Number(sessionStorage.getItem('cachePage'));
      if(page){
        this.currentPage = page;
        this.getDataList();
        sessionStorage.setItem('cachePage',null);
      }else{
        this.getDataList();
      }
    },
    methods: {
      apiMethods(params){
        api.getOrganizationInfo(params).then((res) => {
          if (res.data.code == '0') {
            const data = res.data.data;
            this.list = data.records;
            this.total = data.total;
          }
        }).catch((error) => {
          console.log(error);
        });
      },
      getDataList() {//获取机构信息
        let param = {};
        if(this.time){
          param = {
            'size':this.pageSize,
            'current':this.currentPage,
            'startTime':this.time[0],
            'endTime':this.time[1],
            'orgName':this.name.trim(),
          };
        }else{
          param = {
            'size':this.pageSize,
            'current':this.currentPage,
            'orgName':this.name.trim(),
          };
        }
        this.apiMethods(param);
        
      },
      indexMethod(index) {
        return ((this.currentPage - 1) * this.pageSize) + index + 1;
      },
      currentChange(next) {
        this.currentPage = next;
        this.getDataList();
      },
      addOrganization(){//添加机构
        this.$router.push({path:'LT-KHZX-TJJG'});
      },
      exportOrganizeInfo() {//导出
        const canExport = utils.exportCondition(this.time);
        if(typeof canExport == 'string'){
          this.$message({
            showClose: true,
            message:canExport,
            type:'warning'
          });
          return;
        }
          const searchTime = this.time;
          const param = {
            "endTime": searchTime[1],
            "startTime": searchTime[0],
            "orgName": this.name||undefined
          };
          api.exportOrganizeInfo(param).then((res) => {
            if (res.data.code = '0') {
              utils.downloadExportedData(res.data, '机构信息表.xls');
              this.$message({showClose: true, message: "导出成功", type: 'success'});
            } else {
              this.$message({
                showClose: true,
                message: res.data.msg,
                type: 'warning'
              });
            }
          }).catch((error) => {
            this.$message({
              showClose: true,
              message: "服务器正忙...",
              type: 'warning'
            });
          });
      },
      formatType:function(row,column,cellValue){//处理机构属性
        if(cellValue ==0){
          return "连锁医疗结构";
        }else if(cellValue ==1){
          return "卫计局";
        }else if(cellValue ==2){
          return "基础医疗单位";
        }else if(cellValue ==3){
          return "医疗诊所";
        }else if(cellValue ==99){
          return "其他";
        }else{
          return null;
        }

      },
      handleModifined(index,colData){
        // this.cachePage = this.currentPage;
        sessionStorage.setItem('cachePage',this.currentPage);
        this.$router.push({path:'LT-KHZX-XGJG',query:{info:colData}});
      },
      getSearch(){//搜索
        this.currentPage = 1;//重置
        this.getDataList();   
      }
    }
  }
</script>

<style lang="less" scoped>
    @import "../../less/admin.less";
</style>