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,
  AtModalHeader,
  AtModalContent,
  AtModalAction,
  AtRadio,
} 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 "taro-ui/dist/style/components/radio.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"; //选择协单人弹窗
import { Fragment } from "react";
import { assistTypeList, assistContentList } from "../../utils/tools/config"

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

  constructor(props) {
    super(props);
    this.state = {
      dtails: {},
      opinion: "",
      publicReleaseLog: [],
      isDetailedOpened: false,
      isModifyOpened: false,
      reasonsInvalidation: "",
      isVerify: false, //判断是否在审核中修改
      selectArrderLocation: {},
      current: this.$instance.router.params.status || "",
      isNo: true,
      foc: false,
      coorderList: [],
      cList: [],
      popup: false,
      selid: "",
      userList: [],
      isSelFiles: false,
      filesList: [],
      uid: "",
      prdid: "",
      // techStartProcess 	0无需审核 1需要审核 2营销审核通过 3营销审核驳回
      // assistProcess 		  0非协单 1协单上级未审核 2协单待审核 3协单部分审核 4协单完全审核 5协单驳回
      // assist 		        0非协单 1主协单 2子协单  3技术助手
      // publicType 	      公出他人企业  0不含他人客户 1待审核 2已审核 3已驳回
      // status=1			      0驳回 1发起 2通过
      // type			          0业务 1技术 2行政 3协单 4协单助手

      detailUrl: '',

      assistTypeName: '',
      assistContentTypeName: '',
    };
    this.examinePublicRelease = this.examinePublicRelease.bind(this);
    this.getReleasetDails = this.getReleasetDails.bind(this);
    this.oidApplication = this.oidApplication.bind(this);
    this.onSelFiles = this.onSelFiles.bind(this);
  }


  componentDidMount() {
    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) => {
        console.log(v)
        if (v.error.length === 0) {
          if (v.data) {
            let list = [];
            let annexUrl = v.data.annexUrl || ''
            for (let i of annexUrl.split(",")) {
              if (i) {
                list.push({ url: resourceAddress + i });
              }
            }
            v.data.annexUrl = list;

            let assistTypeName = ''
            let assistContentTypeName = ''
            console.log(v.data.assistantName)
            if ([5, 6].indexOf(v.data.type) > -1 || (v.data.type == 0 && v.data.assistAidName)) {
      
              const assistType = v.data.assistType || ''
              const assistContentType = v.data.assistContentType || ''
      
              let currAssistTypeOption = assistTypeList.filter(item => assistType.indexOf(item.id) > -1)
              assistTypeName = currAssistTypeOption.map(item => item.title).join(',')
      
              let currAssistContentTypeOption = assistContentList.filter(item => assistContentType.indexOf(item.id) > -1)
              assistContentTypeName = currAssistContentTypeOption.map(item => item.title).join(',')
            }

            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,
              },
              assistTypeName,
              assistContentTypeName,
            });
          } else {
            setTimeout(() => {
              // Taro.switchTab({
              //   url: "/pages/punchClock/index",
              // });
              Taro.navigateBack()
            }, 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, evaluateType) {
    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);
            this.examinePublicRelease(sta, evaluateType)
          }
          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, evaluateType) {
    if (!this.state.opinion) {
      Taro.showToast({ title: "请填写审批意见", icon: "none" });
      return;
    }
    Taro.showLoading({ title: "提交中..." });
    let isSuperior = this.state.dtails.techStartProcess == 1  // 技术审核
      ? 3
      : this.state.dtails.publicType == 1   // 营销审核
        ? 2
        : this.state.dtails.assistProcess == 2  // 协单审核
          ? 4
          : 1  // 上级审核
    examinePublicRelease(
      isSuperior,
      {
        evaluateType,
        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(evaluateType) {
    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, evaluateType);
              },
            })
          } else {
            _this.setState({
              isNewshow: false,
              isInquiryOpened: true,
              inquiryTitle: "提醒",
              inquiryContent: "您确定要同意此申请吗?",
              inquiryFn: () => {
                _this.agree(2, evaluateType);
              },
            })
          }
        }
      })
      .catch(() => {
        this.setState({
          loading: false,
        });
      });
  }

  onSelFiles(data, type) {
    let url = '';
    if (type == 1) {
      // 企业档案表
      url = "/pages/customerProfile/index";
    } else if (type == 2) {
      // 面谈思路表
      url = "/pages/interviewDetail/index";
    }
    let list = []
    let userNames = data.userNames.split(",")
    let UserIds = data.uids.split(",")
    if (UserIds.length > 1) {
      
      for (var i = 0; i < userNames.length; i++) {
        list.push({ label: userNames[i], value: UserIds[i], prdid: data.prdList[i] ? data.prdList[i].id : '' })
      }
      this.setState({
        filesList: list,
        isSelFiles: true,
        detailUrl: url
      })
    } else {
      Taro.navigateTo({
        url: url + "?id=" + data.uids + "&prdid="+ data.prdList[0].id +"&notRequired=false&readonly=true&publicType="+this.state.dtails.publicType
      });
    }
  }

  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 && (dtails.assistProcess == 2 || dtails.assist === 1 || dtails.assist === 2)
              ? <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">
                公出地点:
                {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(JSON.parse(JSON.stringify(dtails.prdList || [])), "districtName")?.map((item, index) =>
                    <View key={index}>{item.districtName}</View>
                  )
                }
              </View>
              <View className="timeContent">
                <View className="time">
                  
                  <View className="num">公出{[5, 6].indexOf(dtails.type) > -1 ? 0 : 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
                          ? "协单助手" : dtails.type == 5
                            ? "非公出协单" : dtails.type == 6
                              ? "非公出协单" : ""}
              </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 className="tbuttom">
                  { dtails.type == 0 ? (
                    <View style={{ margin: '6px 0'}} onClick={e => {
                      e.stopPropagation()
                      this.onSelFiles(dtails, 2)
                    }}>查看面谈思路表</View>
                  ) : null }
                  {/* <View onClick={e => {
                    e.stopPropagation()
                    this.onSelFiles(dtails, 1)
                  }}>查看客户档案</View>  */}
                </View>
              </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>}
            {dtails.alone != 0 &&
              <View className="item">
                <View className="title">本人公出</View>
                <View className="value">{["", "是，一同公出", "否，本人不公出"][dtails.alone]}</View>
              </View>}
            { [5, 6].indexOf(dtails.type) > -1 || (dtails.type == 0 && dtails.assistAidName) ? (
              <Fragment>
                <View className="item">
                  <View className="title">协单类型</View>
                  <View className="value">{this.state.assistTypeName}</View>
                </View>
                <View className="item">
                  <View className="title">协单内容</View>
                  <View className="value">{this.state.assistContentTypeName}</View>
                </View>
                { (dtails.assistContentType || '').indexOf('0') > -1 && (
                  <View className="item">
                    <View className="title">内容说明</View>
                    <View className="value">{dtails.assistContent}</View>
                  </View>
                ) }
              </Fragment>
            ) : null }

            {/* 公出目标 */}
            {[1, 2, 5].indexOf(dtails.type) > -1 && (<View className="item">
              <View className="title">公出目标</View>
              <View className="value">{dtails.remarks}</View>
            </View>)}
            {/* 公出计划 */}
            {[1, 5].indexOf(dtails.type) > -1 && (
              <View className="item">
                <View className="title">公出计划</View>
                <View className="value">{dtails.plan}</View>
              </View>
            )}
            {/* 预计效果 */}
            {[1, 5].indexOf(dtails.type) > -1 && (
              <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 && dtails.myExamine === 1) ||
              (dtails.status === 1 && dtails.myExamine === 1 && dtails.assistProcess === 0) ||
              (dtails.status === 1 && dtails.myExamine === 1 && dtails.assistProcess === 1) ||
              (dtails.myExamine === 1 && dtails.publicType == 1) ||
              (dtails.myExamine === 1 && 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,
                    });
                  }}
                  count={false}
                  maxLength={1000}
                  placeholder="请填写审批意见"
                />
                <View className="operation">
                  <AtButton
                    type="secondary"
                    circle
                    loading={this.state.loading}
                    onClick={() => {
                      this.setState({
                        isInquiryOpened: true,
                        inquiryTitle: "提醒",
                        inquiryContent: "您确定要驳回此申请吗?",
                        inquiryFn: () => {
                          this.agree(0, 0);
                        },
                      });
                    }}
                  >
                    驳回
                  </AtButton>
                  <AtButton
                    type="primary"
                    loading={this.state.loading}
                    circle
                    onClick={() => {
                      if (this.state.loading) {
                        return;
                      }
                      dtails.type == 1
                        ? this.checkOrderNoDuration(0)
                        : this.setState({
                          isInquiryOpened: true,
                          inquiryTitle: "提醒",
                          inquiryContent: "您确定要同意此申请吗?",
                          inquiryFn: () => {
                            this.agree(2, 0);
                          },
                        });
                    }}
                  >
                    同意
                  </AtButton>
                  <AtButton
                    type="primary"
                    loading={this.state.loading}
                    circle
                    onClick={() => {
                      if (this.state.loading) {
                        return;
                      }
                      dtails.type == 1
                        ? this.checkOrderNoDuration(1)
                        : this.setState({
                          isInquiryOpened: true,
                          inquiryTitle: "提醒",
                          inquiryContent: "您确定要同意此申请，并存为指导意见吗?",
                          inquiryFn: () => {
                            this.agree(2, 1);
                          },
                        });
                    }}
                  >
                    同意,并存为指导意见
                  </AtButton>
                </View>
              </View>}
            {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}
            {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.setState({
              isInquiryOpened: false
            }, () => {
              this.state.inquiryFn();
              this.setState({
                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)}
          />
        }
        <AtModal
          closeOnClickOverlay={false}
          isOpened={this.state.isSelFiles}
        >
          <AtModalHeader>请选择</AtModalHeader>
          <AtModalContent>
            <AtRadio
              options={this.state.filesList}
              value={this.state.uid}
              onClick={e => {
                let currFileItem = this.state.filesList.find(item => item.value == e);
                this.setState({
                  uid: e,
                  prdid: currFileItem.prdid
                })
              }}
            />
          </AtModalContent>
          <AtModalAction>
            <Button type='secondary'
              onClick={() => {
                this.setState({
                  isSelFiles: false
                })
              }}>取消</Button>
            <Button type='primary'
              onClick={() => {
                this.setState({
                  isSelFiles: false
                })
                Taro.navigateTo({
                  url: this.state.detailUrl + "?id=" + this.state.uid + "&notRequired=false&readonly=true&prdid="+this.state.prdid+"&publicType="+dtails.publicType,
                });
              }}>确定</Button>
          </AtModalAction>
        </AtModal>
      </View>
    );
  }
}

export default EgressDetails;
