<template>
  <div class="institution_container body_container">
    <a-spin :spinning="loading">
      <a-row>
        <a-col :span="18">
          <a-input-search
            allowClear
            v-model="pager.queryParams.F_orgName_like"
            :placeholder="$t('请输入机构名称')"
            @search="querySearch"
          />
        </a-col>
        <a-col :span="6" align="right">
          <a-space :size="12">
            <a-button type="primary" icon="search" @click="querySearch">{{
              $t("查询")
            }}</a-button>
            <a-button v-if="false" type="primary" icon="plus" @click="edit({})" v-w-auth-code="'add'">{{
              $t("新增")
            }}</a-button>
          </a-space>
        </a-col>
      </a-row>
      <div class="table_list">
        <vxe-table
          ref="tableList"
          show-overflow
          show-header-overflow
          border
          resizable
          :row-config="{ isHover: true }"
          :tree-config="{
            transform: true,
            rowField: 'orgId',
            parentField: 'parentOrg',
            expandAll: true,
            trigger: 'cell',
          }"
          :data="lists"
          height="auto"
        >
          <vxe-column field="orgName" :title="$t('机构名称')" tree-node></vxe-column>
          <vxe-column field="sysOrgCode" :title="$t('机构代码')"> </vxe-column>
          <vxe-column field="orgTypeName" :title="$t('机构类别')"> </vxe-column>
          <vxe-column field="hospitalLevelName" :title="$t('医院级别')">
            <template #default="{ row }">{{ $t(row.hospitalLevelName) }}</template>
          </vxe-column>
          <vxe-column field="title" :title="$t('操作')" align="center" v-if="false">
            <template #default="{ row }">
              <div class="operate">
                <a-button type="link" @click="edit(row)" v-w-auth-code="'edit'">{{
                  $t("编辑")
                }}</a-button>
                <a-popconfirm
                  :title="$t('确定要删除吗')"
                  :ok-text="$t('是')"
                  :cancel-text="$t('否')"
                  placement="left"
                  @confirm="del(row)"
                  v-w-auth-code="'delete'"
                >
                  <a-button type="link" class="a_danger">{{ $t("删除") }}</a-button>
                </a-popconfirm>
              </div>
            </template>
          </vxe-column>
          <template #empty>
            <a-empty
              :image-style="{
                height: '80px',
              }"
            >
              <span slot="description">{{ $t("暂无数据") }}</span>
            </a-empty>
          </template>
        </vxe-table>
      </div>
    </a-spin>
    <orgDetail
      :show.sync="editInfo.show"
      :info="editInfo.info"
      @callBack="getTableList"
    ></orgDetail>
  </div>
</template>
<script>
import orgDetail from "./components/orgDetail.vue";
const $appService = require("w-vue-basis/src/api/appService");

export default {
  components: { orgDetail },
  data() {
    return {
      loading: false,
      pager: {
        pageNum: 1,
        pageSize: 1000000,
        queryParams: {
          F_orgName_like: undefined,
          ORDER_createTime_asc: "0",
        },
      },
      lists: [],
      editInfo: {
        show: false,
        info: {},
      },
    };
  },
  created() {
    this.getTableList();
  },
  methods: {
    /**
     * @Author: y_zp
     * @description: 获取机构列表
     */
    getTableList() {
      $appService
        .getSysOrg({ ...this.pager })
        .then((req) => {
          this.total = Number(req.count);
          this.lists = req.data;
        })
        .finally(() => {
          this.$refs.tableList.setAllTreeExpand(true);
        });
    },

    /**
     * @Author: y_zp
     * @description: 查询
     */
    querySearch() {
      this.pager.pageNum = 1;
      this.getTableList();
    },
    /**
     * @Author: y_zp
     * @description: 编辑
     */
    edit(row) {
      this.editInfo = {
        show: true,
        info: row,
      };
    },
    /**
     * @Author: y_zp
     * @description: 删除
     */
    del(row) {
      $appService.delSysOrg(row.orgId).then((req) => {
        this.$message.success($t("删除成功"));
        this.getTableList();
      });
    },
  },
};
</script>
<style lang="less" scoped>
.institution_container {
  .ant-select.middle {
    width: 140px;
  }
  .ant-input-search.middle {
    width: 160px;
  }
  .table_list {
    width: 100%;
    height: calc(100vh - 190px);
    display: inline-block;
    margin-top: 16px;

    /deep/.icon-minus-fill,
    /deep/.icon-plus-fill {
      position: relative;
      display: block;
      width: 100%;
      height: 100%;
      border: 1px solid #999;
    }
    /deep/.icon-minus-fill::before,
    /deep/.icon-plus-fill::before {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      width: 8px;
      height: 1px;
      margin-left: -4px;
      background: #999;
    }
    /deep/.icon-plus-fill::after {
      position: absolute;
      content: "";
      top: 50%;
      left: 50%;
      width: 1px;
      height: 9px;
      margin-top: -4px;
      background: #999;
    }
  }
}
</style>
