<template>
  <div class="container-wrapper">
    <el-button type="primary" @click="isShow=true">新增</el-button>
    <el-table :data="tableData" style="width: 100%" @row-click="rowClick">
      <el-table-column prop="date" label="日期" width="180">
        <template #default="scope">
          {{ formatDate(scope.row.createDatetime) }}
        </template>
      </el-table-column>
      <el-table-column prop="name" label="姓名" width="180"/>
      <el-table-column prop="role" label="角色" width="180">
        <template #default="scope">
          {{ roleList.find((item: any) => item.value === scope.row.role)?.label || '-' }}
        </template>
      </el-table-column>
      <el-table-column prop="sectionId" label="科室">
        <template #default="scope">
          {{ sectionList.find((item: any) => item.id === scope.row.sectionId)?.name || '-' }}
        </template>
      </el-table-column>
      <el-table-column prop="memo" label="备注"/>
    </el-table>
    <Mask :is-show="isShow" @close="isShow=false" :width="800" :height="600" title="成员管理">
      <MemberEdit :id="id" ref="memberEditRef" @onSubmit="init()"></MemberEdit>
    </Mask>
  </div>
</template>
<script setup lang="ts">
import {onMounted, ref, nextTick} from "vue"
import Mask from '@/components/common/Mask.vue'
import MemberEdit from "@/components/settings/MemberEdit.vue";
import {post} from "@/utils/request.ts";
import {formatDate} from "@/utils/dateUtils.ts";

const id = ref<any>("")
const isShow = ref(false)
const tableData = ref<any>([]);
const memberEditRef = ref<any>(null)
const rowClick = (row: any) => {
  id.value = row.id
  isShow.value = true
  nextTick(() => {
    memberEditRef.value?.init(row.id)
  })
}
const roleList = [
  {
    value: 1,
    label: '医生',
  },
  {
    value: 2,
    label: '护士',
  },
  {
    value: 3,
    label: '检验技师',
  },
  {
    value: 4,
    label: '理疗师',
  },
  {
    value: 5,
    label: '医生助手',
  },
  {
    value: 6,
    label: '检查技师',
  },
  {
    value: 7,
    label: '管理员',
  },
  {
    value: 8,
    label: '其他',
  },
]
const init = (() => {
  isShow.value = false
  post('organization/member/list ', {page: 1, size: 100}).then((res: any) => {
    tableData.value = res.list
    list()
  })
})
const deleteDoctor = (row: any) => {
  post('organization/member/list ', {id}).then((res: any) => {
    init()
  })
  console.log(row)
}
const sectionList = ref<any>([]);
const list = () => {
  post('organization/section/allList').then((res: any) => {
    sectionList.value = res
  })
}
onMounted(() => {
  init()
})
</script>
<style scoped lang="scss">
@use "@/assets/scss/base.scss";

</style>