<template>
  <div class="m-pop">
    <div class="wrap wrap-width2">
      <cpt-card>
        <div class="title">
          <img src="@/assets/img/shuju/title-tip.png" />
          <span>详情</span>
        </div>

        <div class="btn-close"
             @click="handleClose">
          <img src="@/assets/img/shuju/people/close.png" />
        </div>
        <div class="m-top">
          <div class="m-info-2 ">
            <div class="m-info-prop">
              <span>姓名：</span>
              <span>{{ eventInfo.name }}</span>
            </div>
            <div class="m-info-prop">
              <span>手机号：</span>
              <span>{{ eventInfo.mobile }}</span>
            </div>

            <div class="m-info-prop">
              <span>证件号：</span>
              <span>{{ eventInfo.idCard }}</span>
            </div>

            <div class="m-info-prop">
              <span>关注原因：</span>
              <span>{{ eventInfo.reason || "--" }}</span>
            </div>
            <div class="m-info-prop">
              <span>隔离状态：</span>
              <span>{{ eventInfo.isolatedStateShow ? eventInfo.isolatedStateShow : '--', }}</span>
            </div>
            <div class="m-info-prop">
              <span>备注：</span>
              <span>{{ eventInfo.remark || "--" }}</span>
            </div>

          </div>

        </div>

      </cpt-card>
    </div>
  </div>
</template>

<script>
import cptCard from "@/views/modules/visual/cpts/card";
import screenLoading from "@/views/modules/visual/cpts/loading";
import { requestPost } from "@/js/dai/request";

import foldText from "@/views/components/foldText";
import dateFormat from "dai-js/tools/dateFormat";

function iniData () {
  return {


    eventProcess: [],

    eventInfo: {
      gridId: "",
      gridName: '',
      createdTime: [],
      eventContent: "",
      imageUrls: [],
      voiceUrls: [],
      sourceType: '',
      address: '',
      reportUserId: "",
      name: "",
      mobile: "",
      idCard: "",

    },

    isolatedStateList: []


  };
}

export default {
  name: "demandInfo",
  props: {
    detailId: {
      type: String,
      default: "",
    },



  },

  components: {
    cptCard,
    screenLoading,
    foldText,
  },

  data: iniData,

  computed: {},

  watch: {
    detailId () {
      let data = iniData();
      Object.keys(data).forEach((k) => {
        this[k] = data[k];
      });
      this.getApiData();
    },

  },

  mounted () {
    console.log(this.detailId);
    this.getApiData();
  },

  methods: {

    handleClose () {
      this.$emit("close");
    },

    async getApiData () {
      await this.getIsolatedStateList();
      await this.getEventInfo();


    },

    // 字典
    async getIsolatedStateList () {
      const url = "/sys/dict/data/dictlist"

      let params = {
        dictType: "isolatedState",
      }

      const { data, code, msg } = await requestPost(url, params)

      if (code === 0) {
        this.isolatedStateList = data
      } else {
        this.$message.error(msg)
      }
    },

    //加载组织数据
    async getEventInfo () {
      const url = "/epmetuser/icEpidemicSpecialAttention/detail";
      //const url = "http://yapi.elinkservice.cn/mock/245/api/gov/project/icEvent/processAnalysis/eventDetail/" + this.detailId;

      const { data, code, msg } = await requestPost(url, {
        id: this.detailId,
      });

      if (code === 0) {
        this.eventInfo = data;

        this.isolatedStateList.forEach(oneState => {
          if (this.eventInfo.isolatedState === oneState.value) {
            this.eventInfo.isolatedStateShow = oneState.label
          }
        });
      } else {
        this.$message.error(msg);
      }
    },




  },
};
</script>

<style
  lang="scss"
  src="@/assets/scss/modules/visual/incident-info.scss"
  scoped
></style>
