import React, { Component, Fragment } from "react";
import Taro from "@tarojs/taro";
import { Text, View, Button, Icon, Radio, RadioGroup } from "@tarojs/components";
import dayjs from "dayjs";
import "./index.less";

import ImagePicker from "../../components/common/imagePicker";
import { resourceAddress } from "../../utils/config";

import { AtButton, AtTextarea, AtIcon, AtCalendar } from "taro-ui";
import {
  updatePublicRelease,
  getWorkingHoursList,
  addPublicRelease,
  checkOrderNoDuration,
  getRestrictProjectUser,
} from "../../utils/servers/servers";

import {
  getHours,
  getNumHourse,
  getUserWordTimes,
  getNameList,
  isPublicity,
} from "../../utils/tools";

import "taro-ui/dist/style/components/form.scss";
import "taro-ui/dist/style/components/button.scss";
import "taro-ui/dist/style/components/loading.scss";
import "taro-ui/dist/style/components/icon.scss";
import "taro-ui/dist/style/components/icon.scss";
import "taro-ui/dist/style/components/textarea.scss";
import "taro-ui/dist/style/components/calendar.scss";

import "./publicContent.less";
import InquiryModal from "../../components/common/inquiryModal";
import UserQuery from "../../components/common/userquery"; //选择协单人弹窗
import CheckboxPicker from "../../components/common/CheckboxPicker";
import { assistTypeList, assistContentList } from "../../utils/tools/config";

class PublicContent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      rangeStartVal: "",
      rangeEndVal: "",
      rangeEndMinuteVal: "",
      rangeStartMinuteVal: "",
      reason: "",
      plan: "",
      expectedEffect: "",
      imgs: [],
      validDates: [],
      totalDuration: 0,
      loading: false,
      workTypeList: [],
      workType: 0,
      isPickerRender: false,
      popup: false,
      coorderList: [],
      cList: [],
      isNewshow: false,
      alone: 1,

      assistType: '',
      assistTypeName: '',
      assistContentType: '',
      assistContentTypeName: '',
      assistContent: '',

      multiplePickerShow: false,
      multiplePickerType: '',
      multiplePickerTitle: '',
      multiplePickerOptions: [],
      multiplePickerCheckedList: [],
    };
    this.onSubmit = this.onSubmit.bind(this);
    this.selectArrder = this.selectArrder.bind(this);
    this.onChange = this.onChange.bind(this);
    this.getWorkingHoursList = this.getWorkingHoursList.bind(this);

    this.onPickerHide = this.onPickerHide.bind(this);
    this.onSetPickerTime = this.onSetPickerTime.bind(this);
    this.getNumHourse = this.getNumHourse.bind(this);
    this.handleOpenMultiplePicker = this.handleOpenMultiplePicker.bind(this)
    this.handleMultipleConfirm = this.handleMultipleConfirm.bind(this)
  }

  componentDidMount() {
    const { dtails, again = false } = this.props
    let arr = [];
    for (let i of this.props.dtails.annexUrl) {
      arr.push(i.url.split(resourceAddress).join(""));
    }
    let list = [];
    if (!dtails.assistAid) {
      list = []
    } else {
      let a = dtails.assistAid.split(",")
      let b = dtails.assistAidName.split(",")
      for (var i = 0; i < a.length; i++) {
        list.push({
          id: a[i],
          name: b[i],
        })
      }
    }
    if (again) {
      // 再次公出详情
      this.setState({
        imgs: arr,
        totalDuration: 0,
        reason: this.props.dtails.remarks,
        validDates: [],
        rangeEndVal: '',
        rangeEndMinuteVal: '',
        rangeStartVal: '',
        rangeStartMinuteVal: '',
        plan: this.props.dtails.plan || "",
        expectedEffect: this.props.dtails.expectedEffect || "",
        cList: list,
        coorderList: !dtails.assistAid ? [] : dtails.assistAid.split(","),
        alone: this.props.dtails.alone,
      })
    } else {
      let rangeStartMinuteVal = dayjs(this.props.dtails.releaseStarts).format("YYYY-MM-DD HH:mm:ss")
      let rangeEndMinuteVal = dayjs(this.props.dtails.releaseEnds).format("YYYY-MM-DD HH:mm:ss")
      let assistTypeName = ''
      let assistContentTypeName = ''
      if ([5, 6].indexOf(this.props.dtails.type) > -1) {
        rangeStartMinuteVal = dayjs(this.props.dtails.releaseStarts).format("YYYY-MM-DD")
        rangeEndMinuteVal = dayjs(this.props.dtails.releaseEnds).format("YYYY-MM-DD")
      }
      if ([5, 6].indexOf(this.props.dtails.type) > -1 || this.props.dtails.type == 0 && list.length) {
        const assistType = this.props.dtails.assistType || ''
        const assistContentType = this.props.dtails.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({
        imgs: arr,
        totalDuration: this.props.dtails.duration,
        reason: this.props.dtails.remarks || '',
        validDates: JSON.parse(this.props.dtails.validDate),
        rangeEndVal: dayjs(this.props.dtails.releaseEnds).format("YYYY-MM-DD"),
        rangeEndMinuteVal,
        rangeStartVal: dayjs(this.props.dtails.releaseStarts).format("YYYY-MM-DD"),
        rangeStartMinuteVal,
        plan: this.props.dtails.plan || "",
        expectedEffect: this.props.dtails.expectedEffect || "",
        cList: list,
        coorderList: !dtails.assistAid ? [] : dtails.assistAid.split(","),
        alone: this.props.dtails.alone,
        assistType: this.props.dtails.assistType,
        assistTypeName,
        assistContentType: this.props.dtails.assistContentType,
        assistContentTypeName,
        assistContent: this.props.dtails.assistContent,
      });
    }

    this.getWorkingHoursList();
  }

  componentWillUnmount() {
    this.imagePickerRef && this.imagePickerRef.clear();
    this.setState({
      rangeStartVal: "",
      rangeEndVal: "",
      rangeEndMinuteVal: "",
      rangeStartMinuteVal: "",
      reason: "",
      plan: "",
      expectedEffect: "",
      imgs: [],
      validDates: [],
      totalDuration: 0,
      loading: false,
    });
  }

  getWorkingHoursList() {
    getWorkingHoursList({})
      .then((v) => {
        if (v.error.length === 0) {
          let obj = Taro.getStorageSync("userInfor");
          let index = v.data.findIndex(
            (value) => value.type === obj.workTimeInfor.type
          );
          this.setState({
            workType: index !== -1 ? index : 0,
          });
          this.setState({
            workTypeList: v.data,
          });
        } else {
          Taro.showToast({
            title: v.error[0].message,
            icon: "none",
          });
        }
      })
      .catch((err) => {
        //console.log(err);
      });
  }

  getNumHourse(startTime, endTime) {
    this.setState({
      totalDuration: getNumHourse(
        startTime,
        endTime,
        this.state.validDates.length
      ),
    });
  }

  // 增加 省 市 区拼接，地址带区域的则把区域去掉
  getArea() {
    const { locationInfor } = this.props
    let address = locationInfor.name;
    let defaultProvince = locationInfor.province || "";
    let defaultCity = locationInfor.city || "";
    let defaultDistrict = locationInfor.district || "";

    // 假设省市区的关键字有 "省", "市", "区"
    const provinceKeyword = '省';
    const cityKeyword = '市';
    const districtKeyword = '区';

    // 判断是否包含省市区关键字，如果不包含则进行补全
    if (address.indexOf(provinceKeyword) === -1) {
      address = `${defaultProvince}${address}`;
    }
    if (address.indexOf(cityKeyword) === -1) {
      address = address.replace(provinceKeyword, `${provinceKeyword}${defaultCity}`);
    }
    if (address.indexOf(districtKeyword) !== -1 && address.indexOf("小区") !== -1) {
      address = address.replace(cityKeyword, `${cityKeyword}${defaultDistrict}`);
    } else if (address.indexOf(districtKeyword) === -1) {
      address = address.replace(cityKeyword, `${cityKeyword}${defaultDistrict}`);
    }
    return address;

  }

  // 修改公出提交
  onSubmit() {
    const { dtails, locationInfor, isVerify = false } = this.props;
    let objectType = this.props.dtails.uids.indexOf(',') > -1 ? 1 : 0
    this.setState({
      loading: true,
    });
    let datas;
    let addressName = !!locationInfor.province ? locationInfor.province + locationInfor.city + locationInfor.district : "";
    if (this.props.dtails.type == 0) {
      datas = {
        id: this.props.dtails.id,
        uids: this.props.dtails.uids,
        releaseStarts: this.state.rangeStartMinuteVal,
        releaseEnds: this.state.rangeEndMinuteVal,
        remarks: this.state.reason,
        plan: this.state.plan,
        expectedEffect: this.state.expectedEffect,
        districtName: this.getArea(),
        addressName: addressName,
        longitude: locationInfor.longitude,
        latitude: locationInfor.latitude,
        annexUrl: this.state.imgs.length === 0 ? "" : this.state.imgs.join(","),
        duration: this.state.totalDuration,
        validDate: JSON.stringify(this.state.validDates),
        type: this.props.dtails.type,
        status: 1,
        alone: this.state.coorderList.length === 0 ? 0 : this.state.alone,
        assist: this.state.coorderList.length === 0 ? 0 : 1,
        assistAid: this.state.coorderList.length === 0 ? "" : this.state.coorderList.join(","),
        assistAidName: this.state.coorderList.length === 0 ? "" : getNameList(this.state.coorderList, this.state.cList).join(","),
      };
      if (this.state.cList.length) {
        datas.assistType = this.state.assistType
        datas.assistContentType = this.state.assistContentType
        datas.assistContent = this.state.assistContent
      }
    } else if (this.props.dtails.type == 2) {
      datas = {
        id: this.props.dtails.id,
        uids: this.props.dtails.uids,
        releaseStarts: this.state.rangeStartMinuteVal,
        releaseEnds: this.state.rangeEndMinuteVal,
        remarks: this.state.reason,
        // plan: this.state.plan,
        // expectedEffect: this.state.expectedEffect,
        districtName: this.getArea(),
        addressName: addressName,
        longitude: this.props.locationInfor.longitude,
        latitude: this.props.locationInfor.latitude,
        annexUrl: this.state.imgs.length === 0 ? "" : this.state.imgs.join(","),
        duration: this.state.totalDuration,
        validDate: JSON.stringify(this.state.validDates),
        type: this.props.dtails.type,
        status: 1,
        alone: this.state.coorderList.length === 0 ? 0 : this.state.alone,
        assist: this.state.coorderList.length === 0 ? 0 : 1,
        assistAid: this.state.coorderList.length === 0 ? "" : this.state.coorderList.join(","),
        assistAidName: this.state.coorderList.length === 0 ? "" : getNameList(this.state.coorderList, this.state.cList).join(","),
      };
    } else {
      datas = {
        id: this.props.dtails.id,
        uids: this.props.dtails.uids,
        releaseStarts: this.state.rangeStartMinuteVal,
        releaseEnds: this.state.rangeEndMinuteVal,
        remarks: this.state.reason,
        plan: this.state.plan,
        expectedEffect: this.state.expectedEffect,
        districtName: this.getArea(),
        addressName: addressName,
        longitude: this.props.locationInfor.longitude,
        latitude: this.props.locationInfor.latitude,
        annexUrl: this.state.imgs.length === 0 ? "" : this.state.imgs.join(","),
        duration: this.state.totalDuration,
        validDate: JSON.stringify(this.state.validDates),
        type: this.props.dtails.type,
        orderNo: this.props.dtails.orderNo,
        status: 1,
        alone: this.state.coorderList.length === 0 ? 0 : this.state.alone,
        assist: this.state.coorderList.length === 0 ? 0 : 1,
        assistAid: this.state.coorderList.length === 0 ? "" : this.state.coorderList.join(","),
        assistAidName: this.state.coorderList.length === 0 ? "" : getNameList(this.state.coorderList, this.state.cList).join(","),
      };
    }
    if (isVerify) {
      datas = { ...datas, ...{ reason: this.props.reason, objectType, } };
    }

    if([5, 6].indexOf(this.props.dtails.type) > -1) {
      datas.assistType = this.state.assistType
      datas.assistContentType = this.state.assistContentType
      datas.assistContent = this.state.assistContent
      datas.duration = 0
    }
  
    for (let key in datas) {
      if (datas[key] === undefined || datas[key] === 'undefined' || datas[key] === null || datas[key] === 'null') {
        delete datas[key];
      }
    }

    updatePublicRelease(datas)
      .then((v) => {
        this.setState({
          loading: false,
        });
        if (v.error.length === 0) {
          Taro.showToast({
            title: "修改成功",
          });
          Taro.eventCenter.trigger("listOperation", {
            type: this.props.permission,
            index: this.props.index,
            status: 1,
            districtName: this.props.locationInfor.name,
            releaseStarts: this.state.rangeStartMinuteVal,
            releaseEnds: this.state.rangeEndMinuteVal,
          });
          this.props.onClose();
        } else {
          Taro.showToast({
            title: v.error[0].message,
            icon: "none",
          });
        }
      })
      .catch(() => {
        this.setState({
          loading: false,
        });
      });
  }
  // 再次公出提交
  goAgain() {
    const { locationInfor } = this.props
    if (!this.state.rangeStartMinuteVal) {
      Taro.showToast({ title: "请选择公出时间", icon: "none" });
      return;
    }
    if (!this.state.rangeEndMinuteVal) {
      Taro.showToast({ title: "请选择公出时间", icon: "none" });
      return;
    }
    if (
      !(
        this.props.locationInfor.longitude &&
        this.props.locationInfor.latitude
      )
    ) {
      Taro.showToast({ title: "请选择公出地点", icon: "none" });
      return;
    }
    if (!this.state.reason) {
      Taro.showToast({ title: "请输入公出目标", icon: "none" });
      return;
    }
    if (!this.state.plan && this.props.dtails.type != 2) {
      Taro.showToast({ title: "请输入公出计划", icon: "none" });
      return;
    }
    if (!this.state.expectedEffect && this.props.dtails.type != 2) {
      Taro.showToast({ title: "请输入预计效果", icon: "none" });
      return;
    }
    if (this.state.totalDuration === 0) {
      Taro.showToast({
        title: "请选择公出时间，目前设置公出时间不足0.5小时",
        icon: "none",
      });
      return;
    }
    let info = Taro.getStorageSync("userInfor");
    if (this.props.dtails.type == 0 && this.state.totalDuration > info.workTimeInfor.minHours && this.state.imgs.length == 0) {
      Taro.showToast({ title: "请上传附件", icon: "none" });
      return
    }
    this.setState({
      loading: true,
    });
    let datas = {
      publicAgain: 1,
      uids: this.props.dtails.uids,
      objectType: this.props.dtails.uids.indexOf(',') > -1 ? 1 : 0,
      releaseStarts: this.state.rangeStartMinuteVal,
      releaseEnds: this.state.rangeEndMinuteVal,
      remarks: this.state.reason,
      districtName: this.getArea(),
      addressName: locationInfor.province + locationInfor.city + locationInfor.district,
      longitude: this.props.locationInfor.longitude,
      latitude: this.props.locationInfor.latitude,
      annexUrl: this.state.imgs.length === 0 ? "" : this.state.imgs.join(","),
      duration: this.state.totalDuration,
      type: this.props.dtails.type,
      validDate: JSON.stringify(this.state.validDates),
      alone: this.state.coorderList.length === 0 ? 0 : this.state.alone,
      assist: this.state.coorderList.length === 0 ? 0 : 1,
      assistAid: this.state.coorderList.length === 0 ? "" : this.state.coorderList.join(","),
      assistAidName: this.state.coorderList.length === 0 ? "" : getNameList(this.state.coorderList, this.state.cList).join(","),
    };
    if (this.props.dtails.type == 0) {
      datas = {
        ...datas,
        ...{
          plan: this.state.plan,
          expectedEffect: this.state.expectedEffect,
        }
      };
    } else if (this.props.dtails.type == 2) {
      datas = datas;
    } else {
      datas = {
        ...datas,
        ...{
          plan: this.state.plan,
          expectedEffect: this.state.expectedEffect,
          orderNo: this.props.dtails.orderNo,
        }
      };
    }
    addPublicRelease(datas)
      .then((v) => {
        this.setState({
          loading: false,
        });
        if (v.error.length === 0) {
          Taro.showToast({
            title: "申请成功",
          });
          // this.props.onClose();
          this.setState({
            isAgains: true,
            goId: v.data.data.id,
            goDatas: v.data.data,
          })
        } else {
          Taro.showToast({
            title: v.error[0].message,
            icon: "none",
          });
        }
      })
      .catch(() => {
        this.setState({
          loading: false,
        });
      });
  }

  selectArrder() {
    const key = "AWBBZ-GRAC2-JFYUO-CLA7I-JAHXK-YFFGT"; //使用在腾讯位置服务申请的key
    const referer = "科德打卡定位"; //调用插件的app的名称
    const category = "公司企业,房产小区";
    Taro.navigateTo({
      url:
        "plugin://chooseLocation/index?key=" +
        key +
        "&referer=" +
        referer +
        "&category=" +
        category,
    });
  }

  onChange(value, type) {
    let arr = this.state.imgs.concat([]);
    if (type === "add") {
      arr.push(value);
    } else if (type === "remove") {
      arr.splice(value, 1);
    }
    this.setState({
      imgs: arr,
    });
  }

  onPickerHide() {
    this.setState({
      isPickerRender: false,
    });
  }

  onSetPickerTime(val) {
    let data = val.detail;
    
    if([5, 6].indexOf(this.props.dtails.type) > -1) {
      data.selectStartTime = dayjs(data.selectStartTime).format('YYYY-MM-DD 08:30:00')
      data.selectEndTime = dayjs(data.selectEndTime).format('YYYY-MM-DD 17:30:00')
      data.startTime = dayjs(data.startTime).format('YYYY-MM-DD 08:30:00')
      data.endTime = dayjs(data.endTime).format('YYYY-MM-DD 17:30:00')
    }

    let rangeStartMinuteVal = data.selectStartTime;
    let rangeEndMinuteVal = data.selectEndTime;

    if ([5, 6].indexOf(this.props.dtails.type) > -1) {
      rangeStartMinuteVal = dayjs(data.selectStartTime).format('YYYY-MM-DD');
      rangeEndMinuteVal = dayjs(data.selectEndTime).format('YYYY-MM-DD');
    }
    this.setState({ rangeStartMinuteVal, rangeEndMinuteVal });

    let arr = [];
    if (data.startTime && data.endTime) {
      let a = dayjs(data.startTime);
      let b = dayjs(data.endTime);
      let num;
      if (a.hour() <= b.hour()) {
        num = b.diff(a, "day") + 1;
      } else {
        num = b.diff(a, "day") + 2;
      }
      let strAdd = data.startTime;
      for (let i = 0; i < num; i++) {
        let time = dayjs(strAdd).add(i, "days").format("YYYY-MM-DD");
        arr.push({ value: time });
      }
    }
    this.setState(
      {
        rangeEndVal: dayjs(data.endTime).format("YYYY-MM-DD"),
        rangeStartVal: dayjs(data.startTime).format("YYYY-MM-DD"),
        validDates: arr,
      },
      () => {
        let a1 = dayjs(dayjs(data.endTime).format("YYYY-MM-DD HH:mm:ss"));
        let b1 = dayjs(dayjs(data.startTime).format("YYYY-MM-DD  HH:mm:ss"));
        this.getNumHourse(b1, a1);
      }
    );
  }
  // 新增技术协单
  setList(list, arr) {
    this.setState({
      cList: list,
      coorderList: arr
    })
  }
  // 弹窗开关
  popupClick() {
    this.setState({
      popup: !this.state.popup
    })
  }
  // 技术公出逻辑判断
  checkOrderNoDuration(type) {
    const _this = this
    if (this.state.totalDuration == 0) {
      Taro.showToast({ title: "请选择公出时间", icon: "none" });
      return
    }
    checkOrderNoDuration({
      id: this.props.dtails.id,
      duration: this.state.totalDuration,
      orderNo: this.props.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.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>如需公出，需<Text style={{ color: 'red' }}>{obj.adminName}</Text>审核。</View>
                <View>请确定，是否发起公出申请！</View>
              </View>,
              inquiryFn: () => {
                type == 1
                  ? _this.onSubmit() : type == 2
                    ? _this.goAgain() : console.log("-")
              },
            })
          } else {
            _this.setState({
              isNewshow: false,
              isInquiryOpened: true,
              inquiryTitle: "提醒",
              inquiryContent: "您确定要提交此申请吗?",
              inquiryFn: () => {
                type == 1
                  ? _this.onSubmit() : type == 2
                    ? _this.goAgain() : console.log("-")
              },
            })
          }
        }
      })
      .catch(() => {
        this.setState({
          loading: false,
        });
      });
  }
  // 业务公出限定项目
  getRestrictProjectUser() {
    const _this = this
    getRestrictProjectUser({
      ids: this.props.dtails.uids,
    })
      .then((v) => {
        if (v.error.length === 0) {
          let arr = []
          if (v.data && v.data.length > 0) {
            v.data.forEach(e => {
              e.type == 1 && arr.push(e["userName"])
            })
          }
          this.setState({
            isInquiryOpened: true,
            inquiryTitle: "提醒",
            inquiryContent: arr.length > 0
              ? <View style={{ color: 'red' }}>您公出的{arr.toString()}，为限定项目的企业，建议您由经理协助公出恰谈！</View>
              : "您确定要提交此申请吗?",
            inquiryFn: () => {
              _this.onSubmit();
            },
          });
        } else {
          Taro.showToast({
            title: v.error[0].message,
            icon: "none",
          });
        }
      })
      .catch((err) => {

      });
  }

  handleOpenMultiplePicker(type) {
    let multiplePickerOptions = [];
    let multiplePickerTitle = '';
    let multiplePickerCheckedList = [];
    const { assistType, assistContentType } = this.state;
    switch (type) {
      case 'assistType':
        // 协单项目类型
        multiplePickerOptions = assistTypeList;
        multiplePickerCheckedList = assistType ? assistType.toString().split(',') : []
        multiplePickerTitle = '请选择协单项目类型';
        break;
      case 'assistContentType':
        // 协单项目内容
        multiplePickerOptions = assistContentList;
        multiplePickerCheckedList = assistContentType ? assistContentType.toString().split(',') : []
        multiplePickerTitle = '请选择协单项目内容';
        break;
      default:
        break;
    }

    this.setState({
      multiplePickerShow: true,
      multiplePickerType: type,
      multiplePickerTitle,
      multiplePickerOptions,
      multiplePickerCheckedList: multiplePickerCheckedList
    })
  }

  handleMultipleConfirm(selectedIds, selectedLabels) {
    const { multiplePickerType } = this.state;
    switch (multiplePickerType) {
      case "assistType":
        // 协单项目类型
        this.setState({
          assistType: selectedIds.join(','),
          assistTypeName: selectedLabels.join(',')
        })
        break;
      case "assistContentType":
        // 协单项目内容
        this.setState({
          assistContentType: selectedIds.join(','),
          assistContentTypeName: selectedLabels.join(',')
        })
        break;
      default:
        break;
    }
  }

  render() {
    const { dtails, userList, type, again = false } = this.props;
    const { cList, coorderList, popup, } = this.state;
    const info = Taro.getStorageSync("userInfor");
    const isShow = dtails.type == 0
      ? isPublicity(userList, 0) : dtails.type == 1
        ? this.state.isNewshow : false;
    const tipList = isPublicity(userList, 1);
    return (
      <View className="publicContent">
        <View className="formItem">
          <View className="formName">公出企业:</View>
          <View className="formValue" style={{ flexDirection: "column", alignItems: "flex-end" }}>
            {/* {dtails.nickname} */}
            {
              !!dtails.userNames && dtails.userNames.indexOf(',') > -1
                ? dtails.userNames.split(',')?.map((item, index) => <View key={index}>{item}</View>)
                : dtails.userNames
            }
          </View>
        </View>
        {
          (dtails.type == 0 && isPublicity(userList, 0)) &&
          <View className="othersTips">您正在申请公出他人企业：需跟单员“
            {isPublicity(userList, 1).toString()}
            ”审核同意，您才可公出!</View>
        }
        <View className="formItem">
          <View className="formName">公出类型:</View>
          <View className="formValue">
            {dtails.type == 0
              ? "业务公出" : dtails.type == 1
                ? "技术公出" : dtails.type == 2
                  ? "行政公出" : dtails.type == 3
                  ? "协单助手" : dtails.type == 5
                    ? "非公出协单" : dtails.type == 6
                      ? "非公出协单" : ""}
          </View>
        </View>
        {dtails.contractNo && dtails.type == 1 ? (
          <View className="formItem">
            <View className="formName">合同编号:</View>
            <View className="formValue">{dtails.contractNo}</View>
          </View>
        ) : (
          ""
        )}
        {
          dtails.type != 5 ? (
            <View className="formItem">
              <View className="formName">作息时间类型:</View>
              <View className="formValue">
                <picker
                  onChange={(e) => {
                    this.setState({
                      workType: e.detail.value,
                    });
                    if (this.state.workTypeList[e.detail.value]) {
                      let obj = Taro.getStorageSync("userInfor");
                      obj.workTimeInfor = this.state.workTypeList[e.detail.value];
                      Taro.setStorageSync("userInfor", obj);
                      this.setState({
                        rangeStartVal: "",
                        rangeStartMinuteVal: "",
                        rangeEndMinuteVal: "",
                        rangeEndVal: "",
                        validDates: [],
                        totalDuration: 0,
                      });
                    }
                  }}
                  value={this.state.workType}
                  rangeKey="name"
                  range={this.state.workTypeList}
                >
                  <view style={{ display: "flex", alignItems: "center" }}>
                    {this.state.workTypeList[this.state.workType]
                      ? this.state.workTypeList[this.state.workType].name
                      : ""}
                    <AtIcon value="chevron-right" size="20" color="#bbbbbb" />
                  </view>
                </picker>
              </View>
            </View>
          ) : null
        }
        <View className="formItem">
          <View className="formName">公出时间:</View>
          <View className="formValue">
            <View
              className="time"
              onClick={() => {
                this.setState({
                  isPickerRender: true,
                });
              }}
            >
              {this.state.rangeStartMinuteVal &&
                this.state.rangeEndMinuteVal ? (
                <View className="timeContent">
                  <View>开始时间:{this.state.rangeStartMinuteVal}</View>
                  <View>结束时间:{this.state.rangeEndMinuteVal}</View>
                </View>
              ) : (
                "请选择公出时间"
              )}
            </View>
            <timePicker
              config={{
                endDate: true,
                column: [5, 6].indexOf(dtails.type) > -1 ? "day" : "minute",
                dateLimit: false,
                initStartTime: this.state.rangeStartMinuteVal, //默认开始时间
                initEndTime: this.state.rangeEndMinuteVal, //默认结束时间
                limitStartTime: dayjs()
                  .subtract(3, "year")
                  .format("YYYY-MM-DD HH:mm:ss"),
                limitEndTime: dayjs()
                  .add(3, "year")
                  .format("YYYY-MM-DD HH:mm:ss"),
              }}
              isPartition
              pickerShow={this.state.isPickerRender}
              onconditionaljudgment={(v) => {
                let formatTemp = [5, 6].indexOf(dtails.type) > -1 ? "YYYY-MM-DD" : "YYYY-MM-DD HH:mm:ss"
                let selTimeStr = dayjs(v.detail.startTime).second(0).format(formatTemp)
                let selEndTimeStr = dayjs(v.detail.endTime).second(0).format(formatTemp)
                
                let startTimeD = dayjs([5, 6].indexOf(dtails.type) > -1 ? `${selTimeStr} 00:00:00` : selTimeStr);
                let endTimeD = dayjs([5, 6].indexOf(dtails.type) > -1 ? `${selEndTimeStr} 23:59:59` : selEndTimeStr);

                let now = dayjs()
                let currTime = [5, 6].indexOf(dtails.type) > -1 ? now.subtract(1, 'day').set('hour', 23).set('minute', 59).set('second', 59) : dayjs().second(0)

                let currTimeD = dayjs(currTime.format("YYYY-MM-DD HH:mm:ss"));
                if (!startTimeD.isAfter(currTimeD)) {
                  Taro.showToast({
                    title: "开始时间不能小于当前时间",
                    icon: "none",
                  });
                  v.detail.setLv(false);
                } else if (!endTimeD.isAfter(startTimeD)) {
                  Taro.showToast({
                    title: "结束时间不能小于开始时间",
                    icon: "none",
                  });
                  v.detail.setLv(false);
                }

              }}
              onhidepicker={() => {
                this.onPickerHide();
              }}
              onsetpickertime={(v) => {
                this.onSetPickerTime(v);
              }}
            />
          </View>
        </View>
        {
          dtails.type != 5 && (
            <View className="formItem">
              <View className="formName">总时长:</View>
              <View className="formValue">{this.state.totalDuration}小时</View>
            </View>
          )
        }
        {
          [0, 5].indexOf(dtails.type) > -1 &&
          <View className="formItem" style={{ alignItems: "flex-start" }}>
            <View className="formName">技术协单:</View>
            <View className="formValues">
              {
                cList.length === 0
                  ? <Text>无</Text>
                  : cList.map((item, index) =>
                    <View className="fitems" key={index}>
                      {item.name}
                      <View className="fclose"
                        onClick={() => {
                          coorderList.includes(item.id) &&
                            (
                              cList.splice(coorderList.indexOf(item.id), 1),
                              coorderList.splice(coorderList.indexOf(item.id), 1)
                            )
                          this.setState({
                            cList,
                            coorderList,
                          })
                        }}
                      ><AtIcon value="close-circle" size="15" color="#bbbbbb" /></View>
                    </View>
                  )
              }
              {cList.length < 5 && <Button className="addbuttom" type='primary' onClick={this.popupClick.bind(this)}>新增技术协单</Button>}
            </View>
          </View>
        }
        {
          [0, 5].indexOf(dtails.type) > -1 &&
          <View className="tips">
            请与技术协商后，再发起协单，协单将统计公出成本等
          </View>
        }
        {
          cList.length >= 1 &&
          <View
            className="formItem"
            style={{ paddingBottom: 0, marginTop: 10 }}
          >
            <View className="formName">
              <Text>本人公出:</Text>
            </View>
            <View>
              <RadioGroup
                onChange={e => {
                  this.setState({
                    alone: e.detail.value
                  })
                }}
              >
                {[{ text: "是，一同公出", value: 1 },
                { text: "否，本人不公出", value: 2 }].map((item, i) => {
                  return (
                    <Radio
                      style={{ marginLeft: 10 }}
                      key={i}
                      value={item.value}
                      checked={item.value == this.state.alone}>
                      {item.text}
                    </Radio>
                  )
                })}
              </RadioGroup>
            </View>
          </View>
        }

        {this.state.validDates.length !== 0 ? (
          <View
            className="formItem"
            style={{ display: "block", paddingTop: "15px" }}
          >
            <View className="formName">
              <View>去除放假时间:</View>
              <View className="tips">
                绿色方块为公出时间,长按即可去除放假时间
              </View>
            </View>
            <AtCalendar
              currentDate={this.state.rangeStartVal}
              minDate={this.state.rangeStartVal}
              maxDate={this.state.rangeEndVal}
              isSwiper={false}
              validDates={this.state.validDates}
              onDayLongClick={(item) => {
                if (
                  !(
                    dayjs(item.value).isSame(this.state.rangeStartVal) ||
                    dayjs(item.value).isSame(this.state.rangeEndVal)
                  )
                ) {
                  if (
                    !(
                      dayjs(item.value).isAfter(this.state.rangeStartVal) &&
                      dayjs(item.value).isBefore(this.state.rangeEndVal)
                    )
                  ) {
                    return;
                  }
                } else {
                  Taro.showToast({
                    title: "开始结束时间不能取消",
                    icon: "none",
                  });
                  return;
                }
                let index = this.state.validDates.findIndex((v) => {
                  let lv = dayjs(v.value).isSame(item.value);
                  return lv;
                });
                const { start, end } = getUserWordTimes();
                let totalDuration = getHours(
                  dayjs().format("YYYY-MM-DD") + start,
                  dayjs(dayjs().format("YYYY-MM-DD") + end)
                ); //一天工作时长
                if (index < 0) {
                  let arr = item.value.split("-");
                  this.state.validDates.push({ value: arr.join("-") });
                  this.setState({
                    validDates: this.state.validDates,
                    totalDuration: this.state.totalDuration + totalDuration,
                  });
                } else {
                  this.state.validDates.splice(index, 1);
                  this.setState({
                    validDates: this.state.validDates,
                    totalDuration: this.state.totalDuration - totalDuration,
                  });
                }
              }}
            />
          </View>
        ) : null}
        <View
          className="formItem"
          style={{
            paddingBottom: 0,
          }}
        >
          <View className="formName">公出地点:</View>
          <View className="formValue" onClick={this.selectArrder}>
            <Text className="formValueText">
              {this.props.locationInfor.name}
            </Text>
            <AtIcon value="chevron-right" size="30" color="#bbbbbb" />
          </View>
        </View>
        <View className="tips">
          以地图为中心100米范围为可打卡区域,移动红标只需要拖动地图即可
        </View>

        { [5, 6].indexOf(dtails.type) > -1 || (dtails.type == 0 && this.state.cList.length) ? (
          <Fragment>
            <View className="formItem">
              <View className="formName"><Text style={{ color: "red" }}>*</Text>协单类型:</View>
              <View className="formValue" onClick={() => this.handleOpenMultiplePicker('assistType')}>
                <Text className="formValueText">
                  { this.state.assistTypeName }
                </Text>
                <AtIcon value="chevron-right" size="30" color="#bbbbbb" />
              </View>
            </View>
            <View className="formItem">
              <View className="formName"><Text style={{ color: "red" }}>*</Text>协单内容:</View>
              <View className="formValue" onClick={() => this.handleOpenMultiplePicker('assistContentType')}>
                <Text className="formValueText">
                  { this.state.assistContentTypeName }
                </Text>
                <AtIcon value="chevron-right" size="30" color="#bbbbbb" />
              </View>
            </View>
            { (this.state.assistContentType || '').indexOf('0') > -1 ? (
              <View className="formItem">
                <View className="formName"><Text style={{ color: "red" }}>*</Text>内容说明:</View>
                <View
                className="formValue"
                style={{ paddingTop: "10px", textAlign: "left" }}
                >
                <AtTextarea
                    height={46}
                    value={this.state.assistContent}
                    onChange={(v) => {
                    this.setState({
                      assistContent: v,
                    });
                    }}
                    count={false}
                    maxLength={1000}
                    placeholder="请输入协单内容说明"
                />
                </View>
              </View>
            ) : null }
          </Fragment>
        ) : null }

        <View
          className="formItem"
          style={{ display: "block", paddingTop: "15px" }}
        >
          {/* 公出目标 */}
          {[1, 2, 5, 6].indexOf(dtails.type) > -1 && (<View className="formName">
            <Text>
              <Text style={{ color: "red" }}>*</Text>
              公出目标:</Text>
            <View
              className="formValue"
              style={{ paddingTop: "10px", textAlign: "left" }}
            >
              <AtTextarea
                height={46}
                value={this.state.reason}
                onChange={(v) => {
                  this.setState({
                    reason: v,
                  });
                }}
                maxLength={200}
                placeholder={
                  dtails.type == 2
                    ? "详细说明本次公出的内容，预计完成的内容"
                    : "本次公出目标，谈的思路与步骤？"
                }
              />
            </View>
          </View>)}
          {/* 公出计划 */}
          {[1, 5, 6].indexOf(dtails.type) > -1 && (
            <View className="formName">
              <Text>
                <Text style={{ color: "red" }}>*</Text>
                公出计划:</Text>
              <View
                className="formValue"
                style={{ paddingTop: "10px", textAlign: "left" }}
              >
                <AtTextarea
                  height={46}
                  value={this.state.plan}
                  onChange={(v) => {
                    this.setState({
                      plan: v,
                    });
                  }}
                  maxLength={200}
                  placeholder="本次公出准备工作"
                />
              </View>
            </View>
          )}
          {/* 预计效果 */}
          {[1, 5, 6].indexOf(dtails.type) > -1 && (
            <View className="formName">
              <Text>
                <Text style={{ color: "red" }}>*</Text>
                预计效果:</Text>
              <View
                className="formValue"
                style={{ paddingTop: "10px", textAlign: "left" }}
              >
                <AtTextarea
                  height={46}
                  value={this.state.expectedEffect}
                  onChange={(v) => {
                    this.setState({
                      expectedEffect: v,
                    });
                  }}
                  maxLength={200}
                  placeholder="预计本次公出效果"
                />
              </View>
            </View>
          )}
        </View>
        <View className="formItem" style={{ display: "block" }}>
          <View className="formName">
            {this.state.totalDuration > info.workTimeInfor.minHours && ![5, 6].includes(dtails.type) && <Text style={{ color: "red" }}>*</Text>}
            附件:
          </View>
          {this.state.totalDuration > info.workTimeInfor.minHours &&
            <View className="tips">
              请上传公出事由的凭证截图，如您与企业的对话截图等
            </View>}
          <View
            className="formValue"
            style={{ paddingTop: "10px", textAlign: "left" }}
          >
            {dtails.annexUrl && this.props.isOpened ? (
              <ImagePicker
                files={dtails.annexUrl}
                showAddBtn={true}
                ref={(ref) => (this.imagePickerRef = ref)}
                url="/api/admin/release/upload"
                onChange={this.onChange}
              />
            ) : null}
          </View>
        </View>
        {/* again为再次公出按钮显示 */}
        {
          again
            ? <View className="operation">
              <AtButton
                disabled={this.state.loading}
                type="secondary"
                circle
                onClick={() => {
                  this.props.onClose();
                }}
              >
                取消
              </AtButton>
              <AtButton
                type="primary"
                loading={this.state.loading}
                circle
                onClick={() => {
                  dtails.type == 1
                    ? this.checkOrderNoDuration(2)
                    : this.setState({
                      isInquiryOpened: true,
                      inquiryTitle: "提醒",
                      inquiryContent: "您确定要提交此申请吗?",
                      inquiryFn: () => {
                        this.goAgain();
                      },
                    });
                }}
              >
                确定
              </AtButton>
            </View>
            : <View className="operation">
              {/* <AtButton
                disabled={this.state.loading}
                type="primary"
                circle
                onClick={() => {
                  this.props.onBack();
                }}
              >
                上一步
              </AtButton> */}
              <AtButton
                disabled={this.state.loading}
                type="secondary"
                circle
                onClick={() => {
                  this.props.onClose();
                }}
              >
                取消
              </AtButton>
              <AtButton
                type="primary"
                loading={this.state.loading}
                circle
                onClick={() => {

                  if (!this.props.dtails.uids) {
                    Taro.showToast({ title: "请选择公出企业", icon: "none" });
                    return;
                  }
                  if (!this.state.rangeStartMinuteVal) {
                    Taro.showToast({ title: "请选择公出时间", icon: "none" });
                    return;
                  }
                  if (!this.state.rangeEndMinuteVal) {
                    Taro.showToast({ title: "请选择公出时间", icon: "none" });
                    return;
                  }

                  if ([5, 6].indexOf(this.props.dtails.type) === -1 && !(this.props.locationInfor.longitude && this.props.locationInfor.latitude)) {
                    Taro.showToast({ title: "请选择公出地点", icon: "none" });
                    return;
                  }

                  if ([5, 6].indexOf(this.props.dtails.type) > -1 && !this.state.cList.length) {
                    Taro.showToast({ title: "请选择协单人", icon: "none" });
                    return;
                  }

                  if ([5, 6].indexOf(this.props.dtails.type) > -1 || (this.props.dtails.type == 0 && this.state.cList.length)) {
                    if (!this.state.assistType) {
                      Taro.showToast({ title: "请选择协单类型", icon: "none" });
                      return
                    }
                    if (!this.state.assistContentType) {
                      Taro.showToast({ title: "请选择协单内容", icon: "none" });
                      return
                    }
                    if (this.state.assistContentType.indexOf('0') > -1 && !this.state.assistContent) {
                      Taro.showToast({ title: "请输入协单内容说明", icon: "none" });
                      return
                    }
                  }

                  if (!this.state.reason && this.props.dtails.type != 0) {
                    Taro.showToast({ title: "请输入公出目标", icon: "none" });
                    return;
                  }
                  if (!this.state.plan && [1, 5, 6].indexOf(this.props.dtails.type) > -1) {
                    Taro.showToast({ title: "请输入公出计划", icon: "none" });
                    return;
                  }
                  if (!this.state.expectedEffect && [1, 5, 6].indexOf(this.props.dtails.type) > -1) {
                    Taro.showToast({ title: "请输入预计效果", icon: "none" });
                    return;
                  }
                  if ([5, 6].indexOf(this.props.dtails.type) === -1 && this.state.totalDuration === 0) {
                    Taro.showToast({
                      title: "请选择公出时间，目前设置公出时间不足0.5小时",
                      icon: "none",
                    });
                    return;
                  }
                  let info = Taro.getStorageSync("userInfor");
                  if ([5, 6].indexOf(this.props.dtails.type) === -1 && this.state.totalDuration > info.workTimeInfor.minHours && this.state.imgs.length == 0) {
                    Taro.showToast({ title: "请上传附件", icon: "none" });
                    return
                  }

                  dtails.type == 1
                    ? this.checkOrderNoDuration(1)
                    : dtails.type == 0
                      ? this.getRestrictProjectUser()
                      : this.setState({
                        isInquiryOpened: true,
                        inquiryTitle: "提醒",
                        inquiryContent: "您确定要修改此申请吗?",
                        inquiryFn: () => {
                          this.onSubmit();
                        },
                      });
                }}
              >
                确定修改
              </AtButton>
            </View>
        }
        <InquiryModal
          isOpened={this.state.isInquiryOpened}
          title={this.state.inquiryTitle}
          content={this.state.inquiryContent}
          onClose={() => {
            this.setState({
              isInquiryOpened: false,
              inquiryTitle: "",
              inquiryContent: "",
            });
          }}
          onDetermine={() => {
            this.state.inquiryFn();
            this.setState({
              isInquiryOpened: false,
              inquiryTitle: "",
              inquiryContent: "",
              inquiryFn: () => { },
            });
          }}
        />
        {popup &&
          <UserQuery
            isOpened={popup}
            onDesc={this.popupClick.bind(this)}
            cList={cList}
            selList={dtails.assistantAid ? dtails.assistantAid.split(",") : []}
            coorderList={coorderList}
            setList={this.setList.bind(this)}
          />
        }
        {/* 再次公出申请成功 */}
        {
          this.state.isAgains &&
          <InquiryModal
            isOpened={this.state.isAgains}
            isNo={false}
            isChildren={true}
            onDetermine={() => {
              this.props.onClose();
              this.setState({
                isAgains: false,
                goId: "",
                goDatas: {},
              })
            }}
            onClose={() => {
              this.props.onClose();
              this.setState({
                isAgains: false,
                goId: "",
                goDatas: {},
              })
            }}
          >
            <View className='result'>
              <View className='resultIcon'>
                {
                  <Icon size='80' type='success' />
                  // isShow
                  //   ? <Icon size='80' type='warn' color='#ff9900' />
                  //   : <Icon size='80' type='success' />
                }
              </View>
              <View className='resultTitle'>
                <View>申请成功
                  {/* {!isShow && ",可以打卡了！"} */}
                </View>
                <View className='resultError'></View>
              </View>
              {/* {
                isShow && dtails.type != 1 &&
                <View className="resultTips">公出他人企业，需跟单人员“
                  {tipList.toString()}
                  ”审核同意，才可以打卡！！!</View>
              } */}
              {
                // isShow && dtails.type == 1 &&
                <View className="resultTips">
                  已发出公出申请！待审核通过，方可打卡！</View>
              }
              <View className='resultOperation'>
                {/* {
                  (!isShow || dtails.type == 1) &&
                  <AtButton circle type='primary' onClick={() => {
                    this.props.onClose();
                    Taro.eventCenter.trigger("GoPunchIn", this.state.goDatas);
                    Taro.switchTab({
                      url: '/pages/punchClock/index',
                    })
                  }}>
                    前往打卡
                  </AtButton>
                } */}
                <AtButton type='secondary' circle onClick={() => {
                  this.props.onClose();
                  this.state.goId &&
                    Taro.navigateTo({
                      url: '/pages/egressDetails/index?id=' + this.state.goId
                    })
                }}>
                  前往分享
                </AtButton>
              </View>
            </View>
          </InquiryModal>
        }

        {/* 多选框 */}
        <CheckboxPicker
          isOpened={this.state.multiplePickerShow}
          title={this.state.multiplePickerTitle}
          options={this.state.multiplePickerOptions}
          checkedList={this.state.multiplePickerCheckedList}
          onClose={() => { this.setState({ multiplePickerShow: false, multiplePickerCheckedList: [] }) }}
          onConfirm={this.handleMultipleConfirm}
        ></CheckboxPicker>
      </View>
    );
  }
}

export default PublicContent;
