<template>
  <uni-popup ref="popup" type="center" :mask-click="false">
    <view class="bg-white rounded overflow-hidden" style="width: 690rpx;">
      <view class="px-15 py-12 text-center text-lg font-semibold text-dark">
        团队模式说明
      </view>
      <view class="px-15">
        <scroll-view scroll-y="true" style="max-height: 60vh;">
          <view v-for="(i, idx) in noticeList" :key="idx" class="text-dark text-base leading-24"
            :class="idx > 0 ? 'mt-5' : ''">{{
              i }}
          </view>
        </scroll-view>
      </view>
      <view class="py-10 px-15">
        <view class="py-10 bg-primary text-base text-white text-center rounded-full" @click="close()">我已知晓</view>
      </view>
      <!-- <button-footer :showShadow="false" :showCancel="false" confirmText="我已知晓" @confirm="close()" /> -->
    </view>
  </uni-popup>
</template>

<script setup>
import { ref, watch } from 'vue';

const emits = defineEmits(['close'])
const props = defineProps({
  visible: {
    type: Boolean,
    default: false
  }
})
const popup = ref();
const noticeList = [
  '团队模式支持您作为团队负责人，邀请同事或您的助理成为团队成员，协助您共同开展患者管理服务。',
  '团队成员可以：',
  ' 1、协助您回复患者的咨询问题；',
  ' 2、协助您开展预问诊工作，整理患者档案资料信息；',
  ' 3、根据您规划的随访路径，接收回访任务并跟进执行。'
]

function close() {
  emits('close')
}


watch(() => props.visible, n => {
  if (n) {
    popup.value && popup.value.open()
  } else {
    popup.value && popup.value.close()
  }
})
</script>

<style lang="scss" scoped>
.mt-5 {
  margin-top: 10rpx;
}

.leading-24 {
  line-height: 48rpx;
}
</style>