manHourHousekeeper/fhKeeper/formulahousekeeper/customerBuler-crm-h5/src/pages/pageComponents/tasks/relatedTasks.vue

<template>
  <div class="flex flex-col h-full overflow-y-auto">
    <div class="info h-full cellnormall" v-if="infoList.length">
      <div v-for="(item, index) in infoList">
        <FoldingPanel :title="`相关任务(${item.taskName})`">
          <template #foldContainer>
            <div class="p-5 bg-white ">
              <van-cell title="任务名称" :value="item.taskName" />
              <van-cell title="优先级" :value="retPriorityStr(item.priority)" />
              <van-cell title="状态" :value="retStatueStr(item.status)" />
              <van-cell title="执行人">
                <template #default>
                  <TranslationComponent :openId="item.executorNames" />
                </template>
              </van-cell>
              <van-cell title="开始时间" :value="item.startDate" />
              <van-cell title="截至时间" :value="item.endDate" />
              <van-cell title="备注" :value="item.taskDesc" />
            </div>
          </template>
        </FoldingPanel>
      </div>
    </div>
    <div v-else class="items-justify-center h-2/3">
      <van-empty description="暂无任务" />
    </div>
  </div>
</template>

<script setup>
import { ref } from 'vue';
import { useLifecycle } from '@hooks/useCommon.js';
import { fixedFieldPriority, fixedFieldTaskStatus } from "@utility/defaultData.js"
import FoldingPanel from '@components/common/foldingPanel.vue';

const props = defineProps({
  infoList: {
    type: Array,
    required: true,
    default: () => ([])
  }
})

function retPriorityStr(value) {
  return fixedFieldPriority.find(item => item.value == value)?.label
}

function retStatueStr(value) {
  return fixedFieldTaskStatus.find(item => item.value == value)?.label
}

useLifecycle({
  load: () => {
    // 添加加载逻辑
  }
});
</script>

<style lang='scss' scoped>
.info {
  margin: 8px 14px 30px 14px;
}
</style>