import React, { Component } from "react";
import { View, Image, Button, Text } from "@tarojs/components";
import Taro, { getCurrentInstance } from "@tarojs/taro";
import {
  AtButton,
  AtCalendar,
  AtIcon,
  AtTextarea,
  AtModal,
  AtModalContent,
  AtModalAction,
} from "taro-ui";
import Skeleton from "taro-skeleton";

import InquiryModal from "../../components/common/inquiryModal";

import Modify from "./modify";
import {
  examinePublicRelease,
  getReleasetDails,
  updatePublicRelease,
  addAssistant,
  deleteAssistant,
  checkOrderNoDuration,
  getRestrictProjectUser,
} from "../../utils/servers/servers";
import { resourceAddress } from "../../utils/config";
import "./index.less";

import "taro-ui/dist/style/components/icon.scss";
import "taro-ui/dist/style/components/textarea.scss";
import "taro-ui/dist/style/components/modal.scss";
import "taro-ui/dist/style/components/timeline.scss";
import "taro-ui/dist/style/components/icon.scss";
import "taro-ui/dist/style/components/calendar.scss";

import Rejected from "../../image/rejected.png";
import Passed from "../../image/passed.png";
import Reviewed from "../../image/reviewed.png";
import Wx from "../../image/wx.png";
import Revoke from "../../image/revoke.png";

import ImagePicker from "../../components/common/imagePicker";
import MessageNoticebar from "../../components/common/messageNoticebar";
import { getClockState, unique, getUids } from "../../utils/tools";
import HistoricalClock from "../../components/historicalClock";
import UserQuery from "../../components/common/userquery"; //选择协单人弹窗

class EgressDetails extends Component {
  $instance = getCurrentInstance();

  constructor(props) {
    super(props);
    this.state = {
      dtails: {},
      opinion: "",
      publicReleaseLog: [],
      isDetailedOpened: false,
      isModifyOpened: false,
      reasonsInvalidation: "",
      isVerify: false, //判断是否在审核中修改
      selectArrderLocation: {},
      current: "",
      isNo: true,
      foc: false,
      coorderList: [],
      cList: [],
      popup: false,
      selid: "",
      userList: [],
    };
    this.examinePublicRelease = this.examinePublicRelease.bind(this);
    this.getReleasetDails = this.getReleasetDails.bind(this);
    this.oidApplication = this.oidApplication.bind(this);
  }

  componentDidMount() {
    this.setState({
      current: this.$instance.router.params.status || "",
      sonType: this.$instance.router.params.sonType || "",
    });
    this.getReleasetDails();
    if (!this.isLogin()) {
      Taro.setStorageSync('currentPage', `/pages/egressDetails/index?id=${this.$instance.router.params.id}`)
    }
  }
  
  isLogin() {
    return !!Taro.getStorageSync('userInfor');
  }

  componentDidShow() {
    //获取地区选定数据
    const chooseLocation = requirePlugin("chooseLocation");
    const location = chooseLocation.getLocation();
    if (location) {
      this.setState({
        selectArrderLocation: location,
      });
    }
  }

  getRestrictProjectUser() {
    const { dtails } = this.state
    getRestrictProjectUser({
      ids: dtails.uids,
    })
      .then((v) => {
        if (v.error.length === 0) {
          this.setState({
            userList: v.data,
            isModifyOpened: true,
            isVerify: true,
            foc: false,
          })
        } else {
          Taro.showToast({
            title: v.error[0].message,
            icon: "none",
          });
        }
      })
      .catch((err) => {

      });
  }

  getReleasetDails() {
    getReleasetDails({
      id: this.$instance.router.params.id,
    })
      .then((v) => {
        if (v.error.length === 0) {
          if (v.data) {
            let list = [];
            for (let i of v.data.annexUrl.split(",")) {
              if (i) {
                list.push({ url: resourceAddress + i });
              }
            }
            v.data.annexUrl = list;
            this.setState({
              dtails: v.data,
              coorderList: v.data.assistantName != null && v.data.assistantName != "" ? v.data.assistantName.split(",") : [],
              cList: v.data.assistantAid != null && v.data.assistantName != "" ? v.data.assistantAid.split(",") : [],
              selectArrderLocation: {
                longitude: parseFloat(v.data.prdList[0]?.longitude),
                latitude: parseFloat(v.data.prdList[0]?.latitude),
                name: v.data.prdList[0]?.districtName,
              },
            });
          } else {
            setTimeout(() => {
              Taro.switchTab({
                url: "/pages/punchClock/index",
              });
            }, 1800);
            Taro.showToast({
              title: "您没有权限查看此公出详情",
              icon: "none",
              duration: 1800,
            });
          }
        } else {
          Taro.showToast({ title: v.error[0].message, icon: "none" });
        }
      })
      .catch((err) => {
        Taro.showToast({ title: "系统错误,请稍后再试", icon: "none" });
        // console.log(err);
      });
  }

  // 同意/驳回
  agree(sta) {
    if (!this.state.opinion) {
      Taro.showToast({ title: "请填写审批意见", icon: "none" });
      return;
    }
    getReleasetDails({
      id: this.$instance.router.params.id,
    })
      .then((v) => {
        if (v.error.length === 0) {
          //如果在审核期间修改过
          if (
            v.data.updateTime != null &&
            this.state.dtails.updateTime !== v.data.updateTime
          ) {
            this.setState({
              isInquiryOpened: true,
              isNo: false,
              inquiryTitle: "提醒",
              inquiryContent: "当前公出申请已修改，请重新审核",
            });
          } else {
            sta === 2
              ? this.examinePublicRelease(2)
              : this.examinePublicRelease(0);
          }
          if (v.data) {
            let list = [];
            for (let i of v.data.annexUrl.split(",")) {
              if (i) {
                list.push({ url: resourceAddress + i });
              }
            }
            v.data.annexUrl = list;
            this.setState({
              dtails: v.data,
              selectArrderLocation: {
                longitude: parseFloat(v.data.prdList[0]?.longitude),
                latitude: parseFloat(v.data.prdList[0]?.latitude),
                name: v.data.prdList[0]?.districtName,
              },
            });
          } else {
            setTimeout(() => {
              Taro.switchTab({
                url: "/pages/punchClock/index",
              });
            }, 1800);
            Taro.showToast({
              title: "您没有权限查看此公出详情",
              icon: "none",
              duration: 1800,
            });
          }
        } else {
          Taro.showToast({ title: v.error[0].message, icon: "none" });
        }
      })
      .catch((err) => {
        Taro.showToast({ title: "系统错误,请稍后再试", icon: "none" });
        // console.log(err);
      });
  }

  examinePublicRelease(status) {
    if (!this.state.opinion) {
      Taro.showToast({ title: "请填写审批意见", icon: "none" });
      return;
    }
    // Taro.showLoading({ title: "加载中..." });
    let isSuperior = this.state.current == "他人公出"
      ? (this.state.sonType == 4 ? 2 : this.state.sonType == 5 && 3)
      : this.state.current == "协单审核" ? 4
        : 1
    examinePublicRelease(
      isSuperior,
      {
        status,
        remarks: this.state.opinion,
        id: this.state.dtails.id,
      }
    )
      .then((v) => {
        Taro.hideLoading();
        if (v.error.length === 0) {
          Taro.showToast({
            title: "操作成功",
            icon: "none",
          });
          this.getReleasetDails();
        } else {
          Taro.showToast({ title: v.error[0].message, icon: "none" });
        }
      })
      .catch(() => {
        Taro.hideLoading();
        Taro.showToast({ title: "系统错误,请稍后再试", icon: "none" });
      });
  }

  onShareAppMessage() {
    return {
      title:
        this.state.dtails.status === 3
          ? this.state.dtails.aname +
          "撤销了前往" +
          this.state.dtails.prdList[0]?.districtName +
          "的公出"
          : this.state.dtails.aname + "将要去" + this.state.dtails.prdList[0]?.districtName,
      path: "pages/egressDetails/index?id=" + this.$instance.router.params.id,
    };
  }

  oidApplication() {
    if (!this.state.reasonsInvalidation) {
      Taro.showToast({ title: "请填写撤销原因", icon: "none" });
      return;
    }
    this.setState({
      loading: true,
    });
    updatePublicRelease({
      id: this.$instance.router.params.id,
      status: 3,
      uids: this.state.dtails.uids,
      reason: this.state.reasonsInvalidation,
    })
      .then((v) => {
        this.setState({
          loading: false,
        });
        if (v.error.length === 0) {
          Taro.showToast({
            title: "修改成功",
          });
          this.setState({
            isInquiryOpened: false,
            inquiryTitle: "",
            inquiryContent: "",
          }, () => {
            this.getReleasetDails();
          });
          Taro.eventCenter.trigger("listOperation", {
            type: this.state.dtails.permission,
            index: this.$instance.router.params.index,
            status: 3,
          });
        } else {
          Taro.showToast({
            title: v.error[0].message,
            icon: "none",
          });
        }
      })
      .catch(() => {
        this.setState({
          loading: false,
        });
      });
  }
  // 弹窗开关
  popupClick(id) {
    !this.state.popup &&
      this.setState({
        selid: id
      })
    this.setState({
      popup: !this.state.popup
    })
  }
  //增加协单助力
  addA(aid) {
    const { selid } = this.state
    addAssistant({
      id: selid,
      aid,
    }).then((v) => {
      if (v.error.length === 0) {
        this.popupClick();
        this.getReleasetDails();
      } else {
        Taro.showToast({ title: v.error[0].message, icon: "none" });
      }
    }).catch((err) => {
      Taro.showToast({ title: "系统错误,请稍后再试", icon: "none" });
    });
  }
  //删除协单助力
  deleteA(id, aid) {
    Taro.showLoading({
      title: '操作中...'
    })
    deleteAssistant({
      id,
      aid,
    }).then((v) => {
      Taro.hideLoading();
      if (v.error.length === 0) {
        this.getReleasetDails();
      } else {
        Taro.showToast({ title: v.error[0].message, icon: "none" });
      }
    }).catch((err) => {
      Taro.hideLoading();
      Taro.showToast({ title: "系统错误,请稍后再试", icon: "none" });
    });
  }
  // 技术公出逻辑判断
  checkOrderNoDuration() {
    const _this = this
    checkOrderNoDuration({
      id: this.state.dtails.id,
      duration: this.state.dtails.duration,
      orderNo: this.state.dtails.orderNo,
    })
      .then((v) => {
        if (v.error.length == 0) {
          if (!v.data.code) {
            let obj = v.data.data
            _this.setState({
              isNewshow: true,
              isInquiryOpened: true,
              inquiryTitle: "提醒",
              inquiryContent: <View style={{ padding: "10px 15px" }}>
                <View><Text style={{ color: 'red' }}>{obj.publicReleaseName}</Text>准备公出<Text style={{ color: 'red' }}>{obj.userName}（{obj.contractNo}）</Text>，</View>
                <View>总计公出：<Text style={{ color: 'red' }}>{obj.peopleCount}人，{obj.timesCount}次，{obj.durationCount}时</Text>。</View>
                <View>
                  <Text style={{ color: 'red' }}>
                    {obj.amountName}，{obj.amountType}
                  </Text>。
                </View>
                <View>请确认是否同意本次公出？</View>
              </View>,
              inquiryFn: () => {
                _this.agree(2);
              },
            })
          } else {
            _this.setState({
              isNewshow: false,
              isInquiryOpened: true,
              inquiryTitle: "提醒",
              inquiryContent: "您确定要同意此申请吗?",
              inquiryFn: () => {
                _this.agree(2);
              },
            })
          }
        }
      })
      .catch(() => {
        this.setState({
          loading: false,
        });
      });
  }

  render() {
    const { dtails, current, cList, coorderList, popup } = this.state;
    return (
      <View className="egressDetails">
        <MessageNoticebar />
        <View
          className="titleContent"
          style={{
            padding: Object.keys(dtails).length === 0 ? "0 30px" : "20px 30px",
          }}
        >
          {Object.keys(dtails).length === 0 ? (
            <Skeleton
              title
              row={3}
              animateName="elastic"
              avatarShape="square"
              loading
            />
          ) : (
            <View>
              <View className="title">
                {dtails.type === 3 ? dtails.mainName : dtails.aname}提交的公出申请
                {dtails.updateStatus == 1 && <View className="titRight">改</View>}
              </View>
              <View className="address">申请时间: {dtails.createTimes}</View>
              <View
                className="state"
                style={{
                  color: getClockState(dtails.status).color,
                }}
              >
                {getClockState(dtails.status).title}
              </View>
              {
                !!dtails.adminExamine && dtails.adminExamine.split(',')?.map(item =>
                  <View style={{ fontSize: "15px", color: "#007AFF" }}>{item}</View>
                )
              }
              <View></View>
              <Image
                src={
                  dtails.status === 0
                    ? Rejected : dtails.status === 1
                      ? Reviewed : dtails.status === 2
                        ? Passed : dtails.status === 3
                          ? Revoke : dtails.status === 4
                            ? Rejected : ""
                }
                className="startIcon"
              />
            </View>
          )}
        </View>
        {Object.keys(dtails).length === 0 ? (
          <View style={{ margin: "20px" }}>
            <Skeleton title row={3} avatarShape="square" loading />
          </View>
        ) : (
          <View className="valueContent">
            {
              dtails.status != 3 && dtails.type == 3 && (current === "查看协单" || current === "我的协单")
                ? <View className="item">
                  <View className="title" style={{ color: "red" }}>协单助手（助手无成本）</View>
                  <View className="cassistant">
                    {
                      coorderList.length == 0
                        ? <Text>无</Text>
                        : coorderList.map((item, index) =>
                          <View className="citems" key={index}>
                            {item}
                            <View className="cclose"
                              onClick={() => {
                                this.setState({
                                  isInquiryOpened: true,
                                  inquiryTitle: "温馨提示",
                                  inquiryContent: "您确定要移除此协单助手吗?",
                                  inquiryFn: () => {
                                    this.deleteA(dtails.id, cList[index])
                                  },
                                });
                              }}
                            ><AtIcon value="close-circle" size="15" color="#bbbbbb" /></View>
                          </View>
                        )
                    }
                    {cList.length < 5 && <Button className="addbuttom" type='primary' onClick={this.popupClick.bind(this, dtails.id)}>添加协单助手</Button>}
                  </View>
                </View>
                : coorderList.length != 0 &&
                <View className="item">
                  <View className="title" style={{ color: "red" }}>协单助手（助手无成本）</View>
                  <View className="cassistant">
                    {
                      coorderList.map((item, index) =>
                        <View className="citems" style={{ paddingRight: 0 }} key={index}>
                          {item}
                        </View>
                      )
                    }
                  </View>
                </View>
            }
            <View className="item">
              <View className="title">
                公出地点:
                {current !== "审核" && dtails.permission === 0
                  && dtails.type !== 3 && dtails.type !== 4 ? (
                  <View
                    className="edit"
                    onClick={() => {
                      Taro.pageScrollTo({ selector: "#reasons" })
                      this.setState({
                        foc: true,
                      });
                    }}
                  >
                    <View style={{ color: "#3864ef", fontSize: "15px" }}>
                      修改
                      <AtIcon value="edit" size="18" color="#3864ef" />
                    </View>
                  </View>
                ) : null}
              </View>
              <View className="value">
                {/* {dtails.districtName} */}
                {
                  unique(dtails.prdList, "districtName")?.map((item, index) =>
                    <View key={index}>{item.districtName}</View>
                  )
                }
              </View>
              <View className="timeContent">
                <View className="time">
                  <View className="num">公出{dtails.duration}小时</View>
                  <View
                    className="journal"
                    onClick={(e) => {
                      e.stopPropagation();
                      this.setState({
                        isDetailedOpened: true,
                      });
                    }}
                  >
                    明细
                  </View>
                </View>
                <View className="timeAxis">
                  <View className="startTime">
                    <View className="circle" />
                    {dtails.releaseStarts}
                  </View>
                  <View className="axis" />
                  <View className="endTime">
                    <View className="circle" />
                    {dtails.releaseEnds}
                  </View>
                </View>
              </View>
            </View>
            <AtModal
              onClose={() => {
                this.setState({
                  isDetailedOpened: false,
                });
              }}
              isOpened={this.state.isDetailedOpened}
            >
              <AtModalContent>
                {dtails.validDate ? (
                  <AtCalendar
                    currentDate={JSON.parse(dtails.validDate)[0]["value"]}
                    isSwiper={false}
                    validDates={JSON.parse(dtails.validDate)}
                  />
                ) : null}
              </AtModalContent>
              <AtModalAction>
                <Button
                  onClick={() => {
                    this.setState({
                      isDetailedOpened: false,
                    });
                  }}
                >
                  确定
                </Button>
              </AtModalAction>
            </AtModal>
            <View className="item">
              <View className="title">公出类型</View>
              <View className="value">
                {dtails.type == 0
                  ? "业务公出" : dtails.type == 1
                    ? "技术公出" : dtails.type == 2
                      ? "行政公出" : dtails.type == 3
                        ? "技术协单" : dtails.type == 4
                          ? "协单助手" : ""}
              </View>
            </View>
            {dtails.type == 1 ? (
              <View className="item">
                <View className="title">合同编号</View>
                <View className="value">{dtails.contractNo}</View>
              </View>
            ) : (
              ""
            )}
            <View className="item">
              <View className="title">公出企业</View>
              <View className="value">
                {/* {dtails.nickname} */}
                {
                  !!dtails.userNames && dtails.userNames.indexOf(',') > -1
                    ? dtails.userNames.split(',')?.map((item, index) => <View key={index}>{item}</View>)
                    : dtails.userNames
                }
              </View>
            </View>
            {
              dtails.assistAidName != null && dtails.assistAidName != "" &&
              <View className="item">
                <View className="title" style={{ color: "red" }}>技术协单（技术协单，将统计相关的公出成本等）</View>
                <View className="value">{dtails.assistAidName.replace(/,/g, " ")}</View>
              </View>
            }
            {/* 公出目标 */}
            <View className="item">
              <View className="title">公出目标</View>
              <View className="value">{dtails.remarks}</View>
            </View>
            {/* 公出计划 */}
            {dtails.type != 2 && (
              <View className="item">
                <View className="title">公出计划</View>
                <View className="value">{dtails.plan}</View>
              </View>
            )}
            {/* 预计效果 */}
            {dtails.type != 2 && (
              <View className="item">
                <View className="title">预计效果</View>
                <View className="value">{dtails.expectedEffect}</View>
              </View>
            )}
            {dtails.annexUrl && dtails.annexUrl.length > 0 ? (
              <View className="item">
                <View className="title">附件</View>
                <View className="value">
                  <ImagePicker files={dtails.annexUrl} showAddBtn={false} />
                </View>
              </View>
            ) : null}
            {((dtails.status === 1 && current === "协单审核" && dtails.myExamine === 0) ||
              (dtails.status === 1 && current === "审核" && dtails.assistProcess === 0) ||
              (dtails.status === 1 && current === "审核" && dtails.assistProcess === 1) ||
              (dtails.myExamine === 0 && current === "他人公出" && dtails.publicType == 1) ||
              (dtails.myExamine === 0 && current === "他人公出" && dtails.techStartProcess == 1)) &&
              <View className="item">
                <View className="title">
                  填写审批意见
                  <View className="titleTips">
                    根据公出申请记录指导怎么沟通？并提出详细指导建议
                  </View>
                </View>
                <AtTextarea
                  value={this.state.opinion}
                  onChange={(value) => {
                    this.setState({
                      opinion: value,
                    });
                  }}
                  maxLength={20}
                  placeholder="请填写审批意见"
                />
                <View className="operation">
                  <AtButton
                    type="secondary"
                    circle
                    loading={this.state.loading}
                    onClick={() => {
                      this.setState({
                        isInquiryOpened: true,
                        inquiryTitle: "提醒",
                        inquiryContent: "您确定要驳回此申请吗?",
                        inquiryFn: () => {
                          this.agree(0);
                          // this.examinePublicRelease(0);
                        },
                      });
                    }}
                  >
                    驳回
                  </AtButton>
                  <AtButton
                    type="primary"
                    loading={this.state.loading}
                    circle
                    onClick={() => {
                      if (this.state.loading) {
                        return;
                      }
                      dtails.type == 1
                        ? this.checkOrderNoDuration()
                        : this.setState({
                          isInquiryOpened: true,
                          inquiryTitle: "提醒",
                          inquiryContent: "您确定要同意此申请吗?",
                          inquiryFn: () => {
                            this.agree(2);
                            // this.examinePublicRelease(2);
                          },
                        });
                    }}
                  >
                    同意
                  </AtButton>
                </View>
              </View>}
            {current !== "审核" && dtails.permission === 0
              && dtails.type !== 3 && dtails.type !== 4 ? (
              <View className="item" id={"reasons"}>
                <View className="title">修改/撤销</View>
                <AtTextarea
                  value={this.state.reasonsInvalidation}
                  focus={this.state.foc}
                  onChange={(value) => {
                    this.setState({
                      reasonsInvalidation: value,
                    });
                  }}
                  maxLength={20}
                  placeholder="请填写修改或撤销的详细原因"
                />
              </View>
            ) : null}
            {current !== "审核" && dtails.permission === 0
              && dtails.type !== 3 && dtails.type !== 4 ? (
              <View className="operation">
                <Button
                  type="warn"
                  disabled={dtails.status === 3}
                  loading={this.state.loading}
                  onClick={() => {
                    if (this.state.loading) {
                      return;
                    }
                    this.setState({
                      isInquiryOpened: true,
                      inquiryTitle: "提醒",
                      inquiryContent: dtails.assist == 1
                        ? "请与技术协单同事协商后再修改，因未协商就个人修改公出内容，产生的影响由个人承担！"
                        : "您确定要撤销此申请吗?",
                      inquiryFn: () => {
                        this.oidApplication();
                      },
                    });
                  }}
                >
                  撤销申请
                </Button>
                <Button
                  style={{ color: "#fff", background: "#4876FF" }}
                  loading={this.state.loading}
                  onClick={() => {
                    if (this.state.loading) {
                      return;
                    }
                    this.setState({
                      isInquiryOpened: true,
                      inquiryTitle: "提醒",
                      inquiryContent: dtails.assist == 1
                        ? "请与技术协单同事协商后再修改，因未协商就个人修改公出内容，产生的影响由个人承担！"
                        : "您确定修改此公出申请吗？确定修改，已完成的审核，将自动解除，重新转化为待审核状态！！！",
                      inquiryFn: () => {
                        if (!this.state.reasonsInvalidation) {
                          Taro.showToast({
                            title: "请填写修改原因",
                            icon: "none",
                          });
                          return;
                        }
                        this.getRestrictProjectUser()
                      },
                    });
                  }}
                >
                  修改申请
                </Button>
              </View>
            ) : null}
          </View>
        )}
        {Object.keys(dtails).length === 0 ? (
          <View style={{ margin: "20px" }}>
            <Skeleton title row={3} avatarShape="square" loading />
          </View>
        ) : (
          <View
            className="valueContent history"
            onClick={(e) => {
              e.stopPropagation();
              this.setState({
                historicalIsOpened: true,
              });
            }}
          >
            查看公出申请日志
            <AtIcon value="chevron-right" size="20" color="#767272" />
          </View>
        )}
        {Object.keys(dtails).length === 0 ? (
          <View style={{ margin: "20px" }}>
            <Skeleton title row={3} avatarShape="square" loading />
          </View>
        ) : (
          <View className="valueContent history">
            <View className="shareContent">
              <Button open-type="share" className="share">
                <Image src={Wx} className="shareIcon" />
              </Button>
              <View className="shareTitle">微信分享</View>
            </View>
          </View>
        )}
        {this.state.isModifyOpened ? (
          <Modify
            permission={dtails.permission}
            index={this.$instance.router.params.index}
            dtails={dtails}
            userList={this.state.userList}
            locationInfor={this.state.selectArrderLocation}
            id={this.$instance.router.params.id}
            isOpened={this.state.isModifyOpened}
            isVerify={this.state.isVerify}
            reason={this.state.reasonsInvalidation}
            onModalClose={() => {
              this.setState({
                isModifyOpened: false,
              });
            }}
            onClose={() => {
              this.setState(
                {
                  isModifyOpened: false,
                  dtails: {},
                  reasonsInvalidation: "",
                },
                () => {
                  this.getReleasetDails();
                }
              );
            }}
          />
        ) : null}
        <InquiryModal
          isOpened={this.state.isInquiryOpened}
          title={this.state.inquiryTitle}
          content={this.state.inquiryContent}
          color={this.state.isNo ? "black" : "red"}
          isNo={this.state.isNo}
          onClose={() => {
            this.setState({
              isInquiryOpened: false,
              inquiryTitle: "",
              inquiryContent: "",
              isNo: true,
            });
          }}
          onDetermine={() => {
            this.state.inquiryFn();
            this.setState({
              isInquiryOpened: false,
              inquiryTitle: "",
              inquiryContent: "",
              isNo: true,
              inquiryFn: () => { },
            });
          }}
        />
        {this.state.historicalIsOpened ? (
          <HistoricalClock
            id={this.$instance.router.params.id}
            isOpened={this.state.historicalIsOpened}
            onClose={() => {
              this.setState({
                historicalIsOpened: false,
              });
            }}
          />
        ) : null}
        {popup &&
          <UserQuery
            isOpened={popup}
            onDesc={this.popupClick.bind(this)}
            coorderList={cList}
            selList={dtails.assistAid ? dtails.assistAid.split(",") : []}
            req={true}
            addClick={this.addA.bind(this)}
          />
        }
      </View>
    );
  }
}

export default EgressDetails;
