<template>
  <ion-page class="list-page">
    <ion-header class="header-theme2">
      <ion-toolbar>
        <ion-buttons slot="start">
          <ion-icon :icon="arrowBackOutline" @click="onCancel"></ion-icon>
        </ion-buttons>
        <ion-title>工作日志详情</ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-content>
      <!-- 详情 -->
      <div class="bw-vue-form">
        <div class="form-title">基本信息</div>
        <div class="form-detail">
          <ion-label>工作日志日期</ion-label>
          <ion-text>{{ workLogData.dataModel.workTime }}</ion-text>
        </div>
        <div class="form-detail">
          <ion-label>日志类型</ion-label>
          <ion-text>{{ workLogData.dataModel.logTypeName }}</ion-text>
        </div>
        <div class="form-detail">
          <ion-label>工作内容</ion-label>
          <ion-text>{{ workLogData.dataModel.workContent }}</ion-text>
        </div>
        <div class="form-detail">
          <ion-label>走访企业数量</ion-label>
          <ion-text>{{ recordsCount.RecordsCompanyNum }}</ion-text>
        </div>
        <div class="form-detail">
          <ion-label>收集岗位</ion-label>
          <ion-text>{{ recordsCount.RecordsPostNum }}</ion-text>
        </div>
        <div class="form-detail">
          <ion-label>登记求职人员</ion-label>
          <ion-text>{{ recordsCount.RecordsJobuserNum }}</ion-text>
        </div>
        <div class="form-detail">
          <ion-label>求职意向</ion-label>
          <ion-text>{{ recordsCount.RecordsJobhuntNum }}</ion-text>
        </div>
      </div>
      <div class="form-detail" style="margin-top: 5px">
        <ion-label style="color: #8c8f93;margin-left: 10px;">
          照片
        </ion-label>
        <b-image v-if="workLogData.dataModel.doWorkID" :file-ref-id="workLogData.dataModel.doWorkID" :readonly="true"
                 :is-single="false"></b-image>
      </div>
    </ion-content>
    <ion-loading
        :is-open="loading"
        message="加载中..."
        @didDismiss="setOpen(false)" >
    </ion-loading>
  </ion-page>
</template>
<script setup lang="ts">
import {computed, defineComponent, reactive, ref, toRefs} from "vue";
import {getSysDictionaryList} from '@/api/system/dictionary';
import {getRecordsCount, getWorkLogById, saveWorkLog} from '@/api/workLog';
import {useRoute, useRouter} from "vue-router";
import {alertController, onIonViewDidEnter} from "@ionic/vue";
import {arrowBackOutline} from 'ionicons/icons';
import {required} from "@vuelidate/validators";
import {useVuelidate} from "@vuelidate/core";
import dayjs from "dayjs";
import BImage from "@/components/bImage.vue";

interface workLogModel {
  dataModel:any
}
interface SelectProps {
  name: string,
  value: string
}

const router = useRouter();
const route = useRoute();
const loading = ref(false);
const logTypeList=ref<SelectProps[]>([]);
const workLogData = reactive<workLogModel>({
  dataModel:{
    doWorkID: null,
    workTime: dayjs().format("YYYY-MM-DD"),
    doTypeID:null,
    workContent: null
  }});
// 日志当天完成工作量数据
const recordsCount = reactive<any>({
  RecordsCompanyNum: null,
  RecordsJobuserNum: null,
  RecordsPostNum: null,
  RecordsJobhuntNum: null,
});

const onCancel = () => {
  router.push("./list");
}

const getWorkTypeList = async function(){
  const data:any =await getSysDictionaryList("LogType");
  logTypeList.value = data;
};

const setOpen = (isOpen: boolean) => {
  loading.value = isOpen;
};

const loadData = async (doWorkID: any) => {
  loading.value = true;
  await getWorkTypeList();
  const reqData = await getWorkLogById(doWorkID);
  workLogData.dataModel = reqData;
  if (workLogData.dataModel.workTime == null) {
    workLogData.dataModel.workTime = dayjs(new Date().toLocaleDateString()).format("YYYY-MM-DD")+"T00:00:00.000+08:00";
  }
  // 查询当天登记业务数据数量
  await getRecordsCount(workLogData.dataModel.userId, workLogData.dataModel.workTime).then((res:any)=>{
    Object.keys(recordsCount).forEach((key)=>{
      recordsCount[key] = res[key];
    })
  });
  loading.value = false;
};


const reload = (doWorkID: any) => {
  workLogData.dataModel = {};
  loadData(doWorkID);
}

onIonViewDidEnter(() => {
  if (route.query.reload)
    reload(route.query.doWorkID);
});
</script>

<style lang="less">

.custom{
  --placeholder-color: gray;
  --placeholder-opacity: 0.5;
}

.title-item{
  margin-left: 15px;
  color:#1c3d70 !important;
  font-size: 14px !important;
  font-weight: bold;
}

</style>