import React, { Component } from "react";
import Taro from "@tarojs/taro";
import { Text, View, Button, Icon } 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,
} from "../../utils/servers/servers";
import { getHours, getNumHourse, getUserWordTimes, getNameList, getList, isTips, } 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"; //选择协单人弹窗
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: [],
};
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);
}
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(","),
})
} else {
// 编辑详情
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: dayjs(this.props.dtails.releaseEnds).format("YYYY-MM-DD HH:mm:ss"),
rangeStartVal: dayjs(this.props.dtails.releaseStarts).format("YYYY-MM-DD"),
rangeStartMinuteVal: dayjs(this.props.dtails.releaseStarts).format("YYYY-MM-DD HH:mm:ss"),
plan: this.props.dtails.plan || "",
expectedEffect: this.props.dtails.expectedEffect || "",
cList: list,
coorderList: !dtails.assistAid ? [] : dtails.assistAid.split(","),
});
}
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
),
});
}
// 修改公出提交
onSubmit() {
const { isVerify = false } = this.props;
let objectType = this.props.dtails.uids.indexOf(',') > -1 ? 1 : 0
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 (
!(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.state.totalDuration > info.workTimeInfor.minHours && this.state.imgs.length == 0) {
Taro.showToast({ title: "请上传附件", icon: "none" });
return
}
this.setState({
loading: true,
});
let datas;
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.props.locationInfor.name,
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,
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 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.props.locationInfor.name,
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,
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.props.locationInfor.name,
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,
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, } };
}
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() {
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.props.locationInfor.name,
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),
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;
this.setState({
rangeStartMinuteVal: data.selectStartTime,
rangeEndMinuteVal: data.selectEndTime,
});
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() {
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:
您准备公出{obj.userName}({obj.contractNo}),
总计公出:{obj.peopleCount}人,{obj.timesCount}次,{obj.durationCount}时。
本合同{["低于1万元以下", "在1~3万", "在3~5万", "在5~10万", "在10万及以上"][obj.amountType]},
{["原则上技术人员不可下户", `本次申请,已超出${obj.durationMax}小时`, `本次公出申请,已超出${obj.durationMax}小时`, `本次公出申请,已超出${obj.durationMax}小时`, ""][obj.amountType]}
。
如需公出,需{obj.adminName}同意后,方可公出。
请确定,是否发起公出申请!
,
inquiryFn: () => {
_this.onSubmit();
},
})
} else {
_this.setState({
isNewshow: false,
isInquiryOpened: true,
inquiryTitle: "提醒",
inquiryContent: "您确定要提交此申请吗?",
inquiryFn: () => {
_this.onSubmit();
},
})
}
}
})
.catch(() => {
this.setState({
loading: false,
});
});
}
render() {
const { dtails, type, again = false } = this.props;
const { cList, coorderList, popup } = this.state
const info = Taro.getStorageSync("userInfor");
return (
公出企业:
{/* {dtails.nickname} */}
{
!!dtails.userNames && dtails.userNames.indexOf(',') > -1
? dtails.userNames.split(',')?.map((item, index) => {item})
: dtails.userNames
}
{
(dtails.type == 0 && !!dtails.newList && isTips(dtails.newList)) &&
您正在申请公出他人企业:需跟单员“
{getList(dtails.newList, "aname", true).toString()}
”审核同意,您才可公出!
}
公出类型:
{dtails.type == 0
? "业务公出" : dtails.type == 1
? "技术公出" : dtails.type == 2
? "行政公出" : dtails.type == 3
? "技术协单" : ""}
{dtails.contractNo && dtails.type == 1 ? (
合同编号:
{dtails.contractNo}
) : (
""
)}
作息时间类型:
{
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}
>
{this.state.workTypeList[this.state.workType]
? this.state.workTypeList[this.state.workType].name
: ""}
公出时间:
{
this.setState({
isPickerRender: true,
});
}}
>
{this.state.rangeStartMinuteVal &&
this.state.rangeEndMinuteVal ? (
开始时间:{this.state.rangeStartMinuteVal}
结束时间:{this.state.rangeEndMinuteVal}
) : (
"请选择公出时间"
)}
{
let a = dayjs(
dayjs(v.detail.endTime)
.second(0)
.format("YYYY-MM-DD HH:mm:ss")
);
let b = dayjs(dayjs().second(0).format("YYYY-MM-DD HH:mm:ss"));
if (a.isBefore(b)) {
Taro.showToast({
title: "结束时间不能小于当前时间",
icon: "none",
});
v.detail.setLv(false);
}
}}
onhidepicker={() => {
this.onPickerHide();
}}
onsetpickertime={(v) => {
this.onSetPickerTime(v);
}}
/>
总时长:
{this.state.totalDuration}小时
{
dtails.type === 0 &&
技术协单:
{
cList.length === 0
? 无
: cList.map((item, index) =>
{item.name}
{
coorderList.includes(item.id) &&
(
cList.splice(coorderList.indexOf(item.id), 1),
coorderList.splice(coorderList.indexOf(item.id), 1)
)
this.setState({
cList,
coorderList,
})
}}
>
)
}
{cList.length < 5 && }
}
{
dtails.type === 0 &&
技术协单,将统计相关的公出成本等
}
{this.state.validDates.length !== 0 ? (
去除放假时间:
绿色方块为公出时间,长按即可去除放假时间
{
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,
});
}
}}
/>
) : null}
公出地点:
{this.props.locationInfor.name}
以地图为中心100米范围为可打卡区域,移动红标只需要拖动地图即可
{/* 公出目标 */}
*
公出目标:
{
this.setState({
reason: v,
});
}}
maxLength={200}
placeholder={
dtails.type == 2
? "详细说明本次公出的内容,预计完成的内容"
: "本次公出目标,谈的思路与步骤?"
}
/>
{/* 公出计划 */}
{dtails.type != 2 && (
*
公出计划:
{
this.setState({
plan: v,
});
}}
maxLength={200}
placeholder="本次公出准备工作"
/>
)}
{/* 预计效果 */}
{dtails.type != 2 && (
*
预计效果:
{
this.setState({
expectedEffect: v,
});
}}
maxLength={200}
placeholder="预计本次公出效果"
/>
)}
{this.state.totalDuration > info.workTimeInfor.minHours && *}
附件:
{this.state.totalDuration > info.workTimeInfor.minHours &&
请上传公出事由的凭证截图,如您与企业的对话截图等
}
{dtails.annexUrl && this.props.isOpened ? (
(this.imagePickerRef = ref)}
url="/api/admin/release/upload"
onChange={this.onChange}
/>
) : null}
{/* again为再次公出按钮显示 */}
{
again
?
{
this.props.onClose();
}}
>
取消
{
this.setState({
isInquiryOpened: true,
inquiryTitle: "提醒",
inquiryContent: "您确定要提交此申请吗?",
inquiryFn: () => {
this.goAgain();
},
});
}}
>
确定
:
{
this.props.onBack();
}}
>
上一步
{
this.props.onClose();
}}
>
取消
{
dtails.type == 1
? this.checkOrderNoDuration()
: this.setState({
isInquiryOpened: true,
inquiryTitle: "提醒",
inquiryContent: "您确定要修改此申请吗?",
inquiryFn: () => {
this.onSubmit();
},
});
}}
>
确定修改
}
{
this.setState({
isInquiryOpened: false,
inquiryTitle: "",
inquiryContent: "",
});
}}
onDetermine={() => {
this.state.inquiryFn();
this.setState({
isInquiryOpened: false,
inquiryTitle: "",
inquiryContent: "",
inquiryFn: () => { },
});
}}
/>
{popup &&
}
{/* 再次公出申请成功 */}
{
this.state.isAgains &&
{
this.props.onClose();
this.setState({
isAgains: false,
goId: "",
goDatas: {},
})
}}
onClose={() => {
this.props.onClose();
this.setState({
isAgains: false,
goId: "",
goDatas: {},
})
}}
>
申请成功,可以打卡了!
{
this.props.onClose();
Taro.eventCenter.trigger("GoPunchIn", this.state.goDatas);
Taro.switchTab({
url: '/pages/punchClock/index',
})
}}>
前往打卡
{
this.props.onClose();
this.state.goId &&
Taro.navigateTo({
url: '/pages/egressDetails/index?id=' + this.state.goId
})
}}>
前往分享
}
);
}
}
export default PublicContent;