<template>
  <div class="global">
    <div class="global-box" v-if="permanents && permanents.length > 0">
      <div class="global-task cursor-pointer" v-for="(item, index) in permanents" :key="index" @click="toDetail(item)">
        <template v-for="v in item.plugins">
          <template v-if="v[0].pluginId == 1">{{ item.name }}</template>
        </template>
      </div>
    </div>
  </div>
</template>

<script setup>
import { computed, watch } from 'vue';
import { useStore } from 'vuex';
import { getPermanent } from 'apis';

const store = useStore();
const project = computed(() => store.state.projects.project); // 项目信息
const roleId = computed(() => store.state.role.roleId); // 当前角色
const permanents = computed(() => store.state.task.permanents); // 日常任务
const sessionPermanents = sessionStorage.getItem('permanents'); // 日常任务缓存

if (sessionPermanents) {
  const arr = JSON.parse(sessionPermanents);
  store.commit('task/setPermanents', arr);
}

watch([project, roleId], async () => {
  if (roleId.value) {
    await getPermanentData(roleId.value); // 根据角色查找永久的日常任务
  }
});

// 日常任务
async function getPermanentData(id) {
  const params = { param: { roleId: id } };
  try {
    const data = await getPermanent(params);
    store.commit('task/setPermanents', data);
    const globalHeight = data.length * 38 + 26;
    store.commit('task/setGlobalHeight', globalHeight);
  } catch (error) {
    throw new Error(error);
  }
}

function toDetail(item) {
  store.commit('task/setTaskDetail', item);
  store.commit('layout/setListStatus', false);
  store.commit('task/setIntellectualId', '');
  store.commit('task/setMeetId', '');
  store.commit('task/setSubMeetId', '');
}
</script>

<style scoped>
.global {
  padding: 16px;
}

.global-box {
  border: 1px solid #cccccc;
  border-radius: 10px;
  padding: 12px 16px;
}

.global-task {
  padding: 8px 0;
  line-height: 22px;
}
</style>
