  <!--生态圈-->
<template>
  <div class="ecology">
    <el-form :inline="true" :model="formOrganization" class="demo-form-inline"> 
      <el-form-item label>
        <el-select
          size="small"
          v-model="formEcology.ecology"
          placeholder="选择小生态"
          @change="selectChangeEcology"
          :disabled="status4Flag == 1"
        >
          <el-option
            v-for="item in ecologySelect"
            :key="item.id"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <span class="span_ecology">{{ checkedEcology }}</span>
    </el-form>
    <el-table
      class="rim"
      ref="multipleEcology"
      :data="tableEcology"
      tooltip-effect="dark"
      style="width: 100%"
    >
      <el-table-column
        type="selection"
        width="55"
        :selectable="selectableTableEcology"
        :reserve-selection="true"
      ></el-table-column>
      <el-table-column prop="name" label="医院名称" min-width="100" align="center"></el-table-column>
      <el-table-column prop="hospitalLevelName" label="医院级别" align="center"></el-table-column>
      <el-table-column prop="provinceName" label="所属省份" align="center"></el-table-column>
      <el-table-column prop="cityName" label="所属城市" align="center"></el-table-column>
      <el-table-column prop="countyName" label="所属区县" align="center"></el-table-column>
      <el-table-column prop="townName" label="所属街道" align="center"></el-table-column>
      <div slot="empty">
        <div class="table-empty">
          <img src="../../../assets/image/no-content1.png">
          <p>没有机构信息！</p>
        </div>
      </div>
    </el-table>
    <div class="pagination">
        <el-pagination
          background
          @size-change="handleSizeEcology"
          @current-change="handleCurrentEcology"
          :current-page="formEcology.pageNum"
          :page-sizes="[10, 20, 40]"
          :page-size="formEcology.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="totalEcology"
        ></el-pagination>
      </div>
  </div>
</template>

<script>
let vm = null;
import { doUpload, getFilePath } from "../../../utils/qiniu-util";
import { mapGetters } from "vuex";
import { openLoading, closeLoading } from "../../../utils/utils";
import * as commonUtil from "../../../utils/utils";
import * as operationData from "../../../utils/operation";
import { getExeclUrl } from "@/utils/index";
import {
  uploadOrgExcel,
  uploadPersonExcel
} from "@/utils/education/educationApi";
import Sortable from "sortablejs";
export default {
  data() {
    return {
      formOrganization: {
        name: "",
        administrativeId: "0",
        administrativeIdList: ["0"],
        level: "-1",
        chechAll: true,
        pageNum: 1,
        pageSize: 10
      },
      status4Flag: '',
      checkedEcology: "",
      ecologySelect: [],
      formEcology: {
        ecology: "",
        pageNum: 1,
        pageSize: 10
      },
      totalEcology: 0,
      tableEcology: [],
      checkTableEcology: "",
      getRowKeysEcology(row) {
        return row.id;
      },
      lookedEcology: [],
      changedEcology: [],
      changedEcology2: [],
      projectId: 623
    }
  },
  created() {
    vm = this;
    this.getEcologySelect();
  },
  methods: {
     //选择小生态
    selectChangeEcology(value) {
      this.formEcology.pageNum = 1;
      //console.log('select',value);
      for (let i = 0; i < this.ecologySelect.length; i++) {
        if (this.ecologySelect[i].value == value) {
          this.checkedEcology = this.ecologySelect[i].label;
        }
      }
      this.formEcology.ecology = value;
      this.getEcology();
    },
    getEcologySelect() {
      let req = {};
      vm
        .GET("portal/scope/v1/" + this.projectId + "/ecology", req)
        .then(res => {
          console.log("查询小生态列表", res);
          this.ecologySelect = operationData.getEcologySelect(res.data.list);
          if (res.data.chooseIdList.length > 0) {
            this.formEcology.ecology = res.data.chooseIdList[0];
            this.getEcology();
          }
        });
    },
    //获取小生态数据
    getEcology() {
      let req = {};
      req = this.formEcology;
      openLoading(vm);
      vm
        .GET("portal/scope/v1/" + this.projectId + "/organization", req)
        .then(res => {
          closeLoading(vm);
          console.log("根基小生态查询机构列表信息", res);
          this.tableEcology = res.data.organizationList;
          this.totalEcology = res.data.total;

          let tableStatus = this.tableEcology;
          tableStatus.forEach(row => {
            this.$refs.multipleEcology.toggleRowSelection(row);
          });
        });
    },
    // 初始化小生态
    initEcology() {
      let tableStatus = this.tableEcology;
      if (typeof tableStatus === "undefined") {
        return;
      }
      tableStatus.forEach(row => {
        let idList = [];
        idList[0] = row.id;
        let intersect = operationData.getIntersect(idList, this.changedEcology);
        let intersect2 = operationData.getIntersect(
          idList,
          this.changedEcology2
        );
        if (intersect.length > 0) {
          //选中
        } else if (intersect2.length > 0) {
          //不选
        } else {
          if (row.status == 1) {
            this.$nextTick(function() {
              this.$refs.multipleEcology.toggleRowSelection(row);
            });
          }
        }
      });
    },
    // 选择生态table
    selectableTableEcology(row, index) {
      return false;
    },
    //科室table修改(分页相关)
    handleSizeEcology(val) {
      console.log(`每页 ${val} 条`);
      this.formEcology.pageSize = val;
      this.getEcology();
    },
    //科室table修改(分页相关)
    handleCurrentEcology(val) {
      console.log(`当前页: ${val}`);
      this.formEcology.pageNum = val;
      this.getEcology();
    },
  }
}
</script>

<style lang="scss" scoped>
</style>
