初始化
This commit is contained in:
733
pages/applyleave/applyleave.vue
Normal file
733
pages/applyleave/applyleave.vue
Normal file
@@ -0,0 +1,733 @@
|
||||
<template>
|
||||
<view class="container" style="padding-bottom: 60px;">
|
||||
<!--学号 -->
|
||||
<view class="form-item">
|
||||
<text class="label">学号:</text>
|
||||
<text class="uni-input">{{ stuInfo.stuNo }}</text>
|
||||
</view>
|
||||
|
||||
<!--姓名 -->
|
||||
<view class="form-item">
|
||||
<text class="label">姓名:</text>
|
||||
<text class="uni-input">{{ stuInfo.studentName }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 性别 -->
|
||||
<view class="form-item">
|
||||
<text class="label">性别:</text>
|
||||
<text class="uni-input">{{ stuInfo.gender }}</text>
|
||||
</view>
|
||||
|
||||
<!--院部 -->
|
||||
<view class="form-item">
|
||||
<text class="label">院部:</text>
|
||||
<text class="uni-input">{{ stuInfo.departmentName }}</text>
|
||||
</view>
|
||||
|
||||
<!--班级 -->
|
||||
<view class="form-item">
|
||||
<text class="label">班级:</text>
|
||||
<text class="uni-input">{{ stuInfo.className }}</text>
|
||||
</view>
|
||||
|
||||
<!--联系电话 -->
|
||||
<view class="form-item">
|
||||
<text class="label">联系电话:</text>
|
||||
<text class="uni-input">{{ stuInfo.phoneNumber }}</text>
|
||||
</view>
|
||||
|
||||
<!--家长姓名 -->
|
||||
<view class="form-item">
|
||||
<text class="label"><text class="required">*</text>家长姓名:</text>
|
||||
<input v-model="formData.fatherName" class="uni-input" focus placeholder="家长姓名" />
|
||||
</view>
|
||||
<!--家长联系电话 -->
|
||||
<view class="form-item">
|
||||
<text class="label"><text class="required">*</text>家长联系电话:</text>
|
||||
<input v-model="formData.fatherRelation" class="uni-input" focus placeholder="家长联系电话" />
|
||||
</view>
|
||||
<!-- 请假事由 -->
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 请假事由:</text>
|
||||
<picker :range="politicalOptions" v-model="formData.selectedPoliticalIndex" @change="onPoliticalChange">
|
||||
<view class="select">{{ politicalOptions[formData.selectedPoliticalIndex] || '请选择请假事由' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
<!-- 请假事由说明 -->
|
||||
<view class="form-text">
|
||||
<text class="label"> <text class="required">*</text> 请假事由说明:</text>
|
||||
<view class="txt">
|
||||
<uni-forms-item>
|
||||
<uni-easyinput type="textarea" v-model="formData.deeds" maxlength="500" placeholder="输入请假事由说明" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 请假时间 -->
|
||||
<view class="form-item"> <!-- 根据选择的申请类型来决定是否显示 -->
|
||||
<text class="label"> <text class="required">*</text> 请假起始时间:</text>
|
||||
|
||||
<view class="example-body">
|
||||
<uni-datetime-picker @change="changeDate('start',$event)" returnType="timestamp"
|
||||
v-model="formData.single" />
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-item"> <!-- 根据选择的申请类型来决定是否显示 -->
|
||||
<text class="label"> <text class="required">*</text> 请假结束时间:</text>
|
||||
<view class="example-body">
|
||||
<uni-datetime-picker @change="changeDate('end',$event)" returnType="timestamp"
|
||||
v-model="formData.endsingle" />
|
||||
</view>
|
||||
</view>
|
||||
<!--请假天数 -->
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 请假天数:</text>
|
||||
<input v-model="formData.dataNum" class="uni-input" focus placeholder="请输入请假天数 " />
|
||||
</view>
|
||||
|
||||
<!-- 目的地 -->
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 目的地:</text>
|
||||
<input v-model="formData.endAddress" class="uni-input" focus placeholder="请输入目的地 " />
|
||||
</view>
|
||||
<!--详细地址 -->
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 详细地址:</text>
|
||||
<input v-model="formData.address" class="uni-input" focus placeholder="请输入详细地址 " />
|
||||
</view>
|
||||
<!-- 是否离桂 -->
|
||||
<view class="form-item">
|
||||
<text class="label">是否离桂:</text>
|
||||
<checkbox class="uni-input" :value="isLeaveGui.toString()" @click="toggleLG" />
|
||||
</view>
|
||||
<!-- 上传佐证 -->
|
||||
<view class="form-img">
|
||||
<text class="label">上传佐证:</text>
|
||||
<view class="example-body">
|
||||
<uni-file-picker @select="uploadEvidence" @delete="onDelImg" :auto-upload="false"
|
||||
limit="9"></uni-file-picker>
|
||||
</view>
|
||||
</view>
|
||||
<!--协议 -->
|
||||
<view class="form-item">
|
||||
安全承诺书:
|
||||
<text class="labelsafe">《广西水利电力职业技术学院安全承诺书》
|
||||
</text>
|
||||
<label>
|
||||
<checkbox :value="checkboxValue.toString()" @click="toggleCheckbox" />
|
||||
</label>
|
||||
</view>
|
||||
<!-- 签名 -->
|
||||
<view class="form-canvas">
|
||||
<text class="label"> <text class="required">*</text> 手写签字:</text>
|
||||
<view class="sign-img" v-if="signImg!=''">
|
||||
<image :src="signImg" mode=""></image>
|
||||
<text @tap="signToggle">重新签名</text>
|
||||
</view>
|
||||
<view v-else class="sign" @tap="signToggle">
|
||||
点击签名
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">备注:</text>
|
||||
<input v-model="remark" class="uni-input" placeholder="请输入备注" />
|
||||
</view>
|
||||
<!-- 按钮 -->
|
||||
<view class="btn">
|
||||
<button style="background-color: red;" @click="clean">清除</button>
|
||||
<button style="background-color: #fff; color: #4097FE;border: 1px solid #4097FE;" @click="save">保存</button>
|
||||
<button :disabled="isSubmitting" @click="applyLeave()">提交申请</button>
|
||||
</view>
|
||||
<!-- 旧签名 -->
|
||||
<!-- <uni-popup ref="popup" background-color="#fff">
|
||||
<view class="popup-content">
|
||||
<liu-signature @change="uploadSign" bgColor="#e8e8e8" lineColor="#000" :height="1500"></liu-signature>
|
||||
</view>
|
||||
</uni-popup> -->
|
||||
<!-- 新签名组件 -->
|
||||
<jp-signature-popup ref="jpSignature" :required="true" popup @change="uploadSign"/>
|
||||
|
||||
<uni-popup class="safety-popup" :is-mask-click="false" ref="safetyPopup" background-color="#fff">
|
||||
<view class="popup-content">
|
||||
<view class="title">
|
||||
请假承诺书
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="txt">
|
||||
1、严格按照学校规定的请假程序提出请假申请,并如实说明请假原因。
|
||||
2、在请假期间,积极补习错过的课程内容,保持对学习的持续关注和学习态度。
|
||||
3、遵守学校纪律和规定,不参与任何影响班级秩序和学校形象的行为。
|
||||
4、如有特殊情况需要延长请假时间,会及时向学校或老师做出说明和沟通。
|
||||
5、意识到请假可能会对我的学业和成绩造成负面影响,我愿意承担相应的责任和后果。
|
||||
</view>
|
||||
<view class="time" v-if="safetime>0">
|
||||
请阅读{{safetime}}s承诺书
|
||||
</view>
|
||||
</view>
|
||||
<view class="safety-btn">
|
||||
<button :disabled="isDisabled" @tap="closeSafePopup">我知道了</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadFile from "@/plugins/upload.js";
|
||||
import {
|
||||
baseUrl
|
||||
} from "@/config.js";
|
||||
import {
|
||||
calculateDays,
|
||||
convertToTimestamp
|
||||
} from "@/utils/time-calculation.js"
|
||||
import {
|
||||
addApply,
|
||||
getStuInfo,
|
||||
commonUpload,
|
||||
leaveSave
|
||||
} from "@/api/applyleave/applyleave.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isSubmitting: false, //表单提交标志位
|
||||
isDisabled: true,
|
||||
safetime: 5,
|
||||
// 用户信息
|
||||
stuInfo: {},
|
||||
studID: "",
|
||||
name: "",
|
||||
courtyard: "",
|
||||
sex: '',
|
||||
classroom: "",
|
||||
phone: "",
|
||||
parent: "",
|
||||
parentPhone: "",
|
||||
selectedOptionIndex: -1, // 当前选中的奖项索引
|
||||
politicalOptions: ['因病', '因事'], // 请假选项
|
||||
beginData: '',
|
||||
endData: "",
|
||||
remark: "",
|
||||
leave: ['是', '否'],
|
||||
leaveIndex: -1,
|
||||
url: "",
|
||||
urltwo: "",
|
||||
checkboxValue: 0,
|
||||
isLeaveGui: 0, //是否离桂
|
||||
//附件
|
||||
attachmentFile: "",
|
||||
signImg: "",
|
||||
formData: {
|
||||
selectedPoliticalIndex: "", // 当前选中的请假索引
|
||||
deeds: "",
|
||||
endsingle: "",
|
||||
single: '',
|
||||
dataNum: "",
|
||||
endAddress: "",
|
||||
address: "",
|
||||
signFile: "",
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getSut();
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.one)
|
||||
},
|
||||
methods: {
|
||||
toggleLG() {
|
||||
this.isLeaveGui = this.isLeaveGui === 1 ? 0 : 1;
|
||||
},
|
||||
// 获取学生信息
|
||||
getSut() {
|
||||
getStuInfo().then(res => {
|
||||
console.log(res);
|
||||
if (res.code == 200) {
|
||||
this.stuInfo = res.data
|
||||
}
|
||||
if (res.code == 500) {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: "error"
|
||||
})
|
||||
}
|
||||
|
||||
});
|
||||
},
|
||||
changeDate(type, e) {
|
||||
this.formData.single = convertToTimestamp(this.formData.single);
|
||||
this.formData.endsingle = convertToTimestamp(this.formData.endsingle);
|
||||
if (type == "end") {
|
||||
this.formData.endsingle = e;
|
||||
if (this.formData.endsingle < this.formData.single) {
|
||||
uni.showToast({
|
||||
title: "时间不能早于请假开始时间",
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
this.formData.dataNum = calculateDays(this.formData.single, this.formData.endsingle);
|
||||
} else {
|
||||
this.formData.single = e;
|
||||
if (this.formData.endsingle < this.formData.single) {
|
||||
uni.showToast({
|
||||
title: "起始时间不能晚于结束时间",
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
this.formData.dataNum = calculateDays(this.formData.single, this.formData.endsingle);
|
||||
}
|
||||
},
|
||||
signToggle() {
|
||||
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
||||
// this.$refs.popup.open('center')
|
||||
//打开签名
|
||||
this.$refs.jpSignature.toPop();
|
||||
},
|
||||
closeSafePopup() {
|
||||
this.$refs.safetyPopup.close('center')
|
||||
},
|
||||
// 提交申请
|
||||
applyLeave() {
|
||||
uni.showLoading({
|
||||
title: "正在提交"
|
||||
})
|
||||
if (this.checkboxValue == 0) {
|
||||
// 如果复选框未被选中,则不允许提交
|
||||
uni.showToast({
|
||||
title: "请勾选承诺书",
|
||||
icon: "error"
|
||||
});
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
if (this.formData.signFile == '') {
|
||||
// 如果复选框未被选中,则不允许提交
|
||||
uni.showToast({
|
||||
title: "请先进行签名",
|
||||
icon: "error"
|
||||
});
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
if (this.formData.endsingle < this.formData.single) {
|
||||
uni.showToast({
|
||||
title: "起始时间不能晚于结束时间",
|
||||
icon: "none"
|
||||
})
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
//表单非空校验
|
||||
const requiredFields = [
|
||||
'selectedPoliticalIndex',
|
||||
'deeds',
|
||||
'endsingle',
|
||||
'single',
|
||||
'dataNum',
|
||||
'endAddress',
|
||||
'address'
|
||||
];
|
||||
const emptyField = requiredFields.find(field => this.formData[field] === "");
|
||||
if (emptyField) {
|
||||
uni.showToast({
|
||||
title: `请填写完必填字段`,
|
||||
icon: "none"
|
||||
})
|
||||
return;
|
||||
}
|
||||
let data = {
|
||||
applicantSignature: this.formData.signFile,
|
||||
attachment: this.attachmentFile,
|
||||
destination: this.formData.endAddress,
|
||||
destinationDetails: this.formData.address,
|
||||
endDate: this.formData.endsingle,
|
||||
leaveDays: this.formData.dataNum,
|
||||
leaveType: this.formData.selectedPoliticalIndex,
|
||||
reason: this.formData.deeds,
|
||||
remark: this.remark,
|
||||
safetyPromise: 1,
|
||||
startDate: this.formData.single
|
||||
}
|
||||
this.isSubmitting = true; // 设置为正在提交
|
||||
addApply(data).then(res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: "提交成功",
|
||||
icon: "success"
|
||||
});
|
||||
uni.hideLoading();
|
||||
this.isSubmitting = false;
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length > 0) {
|
||||
const prevPage = pages[pages.length - 2]
|
||||
if (prevPage && typeof prevPage.getLeaveList ===
|
||||
'function') {
|
||||
prevPage.getLeaveList();
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "提交失败,请先填写完整内容",
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
//上传佐证
|
||||
uploadEvidence(e) {
|
||||
uploadFile('/common/upload', e.tempFilePaths[0]).then((res) => {
|
||||
if (this.attachmentFile !== "") {
|
||||
this.attachmentFile = this.attachmentFile + "," + JSON.parse(res).fileName;
|
||||
} else {
|
||||
this.attachmentFile = JSON.parse(res).fileName;
|
||||
}
|
||||
})
|
||||
},
|
||||
//删除已选图片
|
||||
onDelImg(e) {
|
||||
console.log(this.attachmentFile);
|
||||
console.log(e);
|
||||
},
|
||||
//上传签名
|
||||
uploadSign(e) {
|
||||
const blob = this.base64ToBlob(e);
|
||||
const fileObj = new File([blob], 'signature', {
|
||||
type: 'image/png'
|
||||
});
|
||||
const formData = new FormData();
|
||||
formData.append("file", fileObj);
|
||||
const formDataObj = this.formDataToObject(formData);
|
||||
uploadFile('/common/upload', '', formDataObj).then((res) => {
|
||||
this.formData.signFile = JSON.parse(res).fileName;
|
||||
this.signImg = baseUrl + JSON.parse(res).fileName;
|
||||
// this.$refs.popup.close('center')
|
||||
})
|
||||
},
|
||||
formDataToObject(formData) {
|
||||
const obj = {};
|
||||
formData.forEach((value, key) => {
|
||||
obj[key] = value;
|
||||
});
|
||||
return obj;
|
||||
},
|
||||
base64ToBlob(base64String) {
|
||||
const byteCharacters = atob(base64String.split(',')[1]);
|
||||
const byteNumbers = new Array(byteCharacters.length);
|
||||
|
||||
for (let i = 0; i < byteCharacters.length; i++) {
|
||||
byteNumbers[i] = byteCharacters.charCodeAt(i);
|
||||
}
|
||||
|
||||
const byteArray = new Uint8Array(byteNumbers);
|
||||
return new Blob([byteArray], {
|
||||
type: 'application/octet-stream'
|
||||
});
|
||||
},
|
||||
onPickerChange(event) {
|
||||
this.selectedOptionIndex = event.detail.value;
|
||||
},
|
||||
onPoliticalChange(event) {
|
||||
this.formData.selectedPoliticalIndex = event.detail.value;
|
||||
},
|
||||
toggleCheckbox() {
|
||||
// 切换 checkboxValue 的值
|
||||
this.checkboxValue = this.checkboxValue === 1 ? 0 : 1;
|
||||
if (this.checkboxValue) {
|
||||
this.$refs.safetyPopup.open('center')
|
||||
if (this.safetime > 0) {
|
||||
const intervalId = setInterval(() => {
|
||||
this.safetime--;
|
||||
console.log(this.safetime);
|
||||
if (this.safetime === 0) {
|
||||
clearInterval(intervalId); // 停止倒计时
|
||||
this.isDisabled = false;
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 清空表单
|
||||
clean() {
|
||||
this.studID = "";
|
||||
this.name = "";
|
||||
this.courtyard = "";
|
||||
this.formData.selectedOptionIndex = "";
|
||||
this.classroom = '';
|
||||
this.phone = '';
|
||||
this.parent = '';
|
||||
this.parentPhone = "";
|
||||
this.selectedPoliticalIndex = ""
|
||||
this.beginData = "";
|
||||
this.endData = '';
|
||||
this.formData.dataNum = '';
|
||||
this.formData.deeds = '';
|
||||
this.leaveIndex = -1;
|
||||
this.formData.endAddress = '';
|
||||
this.formData.address = '';
|
||||
this.isChecked = false;
|
||||
this.$forceUpdate(); // 强制更新组件
|
||||
this.url = ''
|
||||
localStorage.removeItem('formData');
|
||||
},
|
||||
//保存假条信息
|
||||
save() {
|
||||
if (this.checkboxValue == 0) {
|
||||
// 如果复选框未被选中,则不允许提交
|
||||
uni.showToast({
|
||||
title: "请勾选承诺书",
|
||||
icon: "error"
|
||||
});
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
if (this.formData.signFile == '' || this.formData.signFile == null) {
|
||||
// 如果复选框未被选中,则不允许提交
|
||||
uni.showToast({
|
||||
title: "请先进行签名",
|
||||
icon: "error"
|
||||
});
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
if (this.endsingle < this.single) {
|
||||
uni.showToast({
|
||||
title: "起始时间不能晚于结束时间",
|
||||
icon: "none"
|
||||
})
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
this.isSubmitting = true;
|
||||
let data = {
|
||||
applicantSignature: this.formData.signFile,
|
||||
attachment: this.attachmentFile,
|
||||
destination: this.endAddress,
|
||||
destinationDetails: this.address,
|
||||
endDate: this.endsingle,
|
||||
leaveDays: this.dataNum,
|
||||
leaveType: this.selectedPoliticalIndex,
|
||||
reason: this.deeds,
|
||||
remark: this.remark,
|
||||
safetyPromise: 1,
|
||||
startDate: this.single
|
||||
}
|
||||
leaveSave(data).then(res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: "保存成功",
|
||||
icon: "success"
|
||||
});
|
||||
this.isSubmitting = false;
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length > 0) {
|
||||
const prevPage = pages[pages.length - 2]
|
||||
if (prevPage && typeof prevPage.getLeaveList ===
|
||||
'function') {
|
||||
prevPage.getLeaveList();
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "提交失败,请先填写完整内容",
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
padding: 15rpx 20rpx;
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
justify-content: space-between;
|
||||
|
||||
checkbox {
|
||||
/deep/.uni-checkbox-input.uni-checkbox-input-checked {
|
||||
background: #007aff;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.form-text {
|
||||
width: 95%;
|
||||
margin-bottom: 20rpx;
|
||||
border-bottom: 1px solid #ededee;
|
||||
}
|
||||
|
||||
.form-img {
|
||||
width: 95%;
|
||||
margin-bottom: 20rpx;
|
||||
border-bottom: 1px solid #ededee;
|
||||
}
|
||||
|
||||
.example-body {
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.txt {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
text-align: right;
|
||||
margin-right: 20rpx;
|
||||
|
||||
.required {
|
||||
color: red;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.select {
|
||||
color: #888889;
|
||||
white-space: nowrap;
|
||||
/* 防止换行 */
|
||||
overflow: hidden;
|
||||
/* 隐藏溢出部分 */
|
||||
text-overflow: ellipsis;
|
||||
/* 显示省略号 */
|
||||
}
|
||||
|
||||
.uni-input {
|
||||
color: #888889;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
margin: 0 auto;
|
||||
border-top: 1px solid #d6d6d6;
|
||||
background: #fff;
|
||||
padding: 10px;
|
||||
right: 0;
|
||||
|
||||
button {
|
||||
width: 30%;
|
||||
background-color: #4097FE;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.form-address {
|
||||
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.labelsafe {
|
||||
color: red;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.form-canvas {
|
||||
width: 95%;
|
||||
margin-bottom: 25px;
|
||||
|
||||
.sign-img {
|
||||
position: relative;
|
||||
margin-top: 8px;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
text {
|
||||
position: absolute;
|
||||
right: 9px;
|
||||
bottom: 10px;
|
||||
background: white;
|
||||
padding: 3px 5px;
|
||||
border-radius: 2px;
|
||||
color: #5c5c5c;
|
||||
}
|
||||
}
|
||||
|
||||
/* height: 700rpx; */
|
||||
.sign {
|
||||
margin-top: 8px;
|
||||
border: 1px solid #ebebeb;
|
||||
padding: 25px;
|
||||
color: #1e6fff;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-box {
|
||||
width: 80%;
|
||||
height: 100vh;
|
||||
background-color: #f0f0f0;
|
||||
|
||||
.success-img {
|
||||
width: 90%;
|
||||
height: 300rpx;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.safety-popup {}
|
||||
</style>
|
||||
|
||||
|
||||
<style lang="scss">
|
||||
.popup-content {
|
||||
height: 100vh;
|
||||
box-sizing: border-box;
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.content {
|
||||
color: #7e7e7e;
|
||||
padding: 0 25px 0 25px;
|
||||
line-height: 25px;
|
||||
|
||||
.time {
|
||||
text-align: center;
|
||||
margin-top: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.safety-btn {
|
||||
margin-top: 35px;
|
||||
border-top: 1px solid #b6b6b6;
|
||||
padding: 5px 0;
|
||||
|
||||
button {
|
||||
&::after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
390
pages/applyleave/cancellationLeave.vue
Normal file
390
pages/applyleave/cancellationLeave.vue
Normal file
@@ -0,0 +1,390 @@
|
||||
<template>
|
||||
<view class="cancel-leave">
|
||||
<!-- 显示定位信息 -->
|
||||
<view class="content">
|
||||
<!-- 地图展示 -->
|
||||
<map style="width: 100%; height: 300px;" :latitude="latitude" :longitude="longitude" :markers="covers"
|
||||
show-location></map>
|
||||
<!-- 重新定位按钮 -->
|
||||
<button class="refresh-location" @tap="getLocation">重新获取定位</button>
|
||||
</view>
|
||||
<!-- 确定销假按钮 -->
|
||||
<button class="confirm-cancel" @tap="confirm">确定销假</button>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getLeaveApplicationByProcInsId,
|
||||
complete,
|
||||
reject
|
||||
} from "@/api/task.js";
|
||||
import {
|
||||
editApply
|
||||
} from "@/api/applyleave/applyleave.js";
|
||||
import {
|
||||
getWxConfig
|
||||
} from "@/api/common/wechat";
|
||||
import wx from "weixin-js-sdk"; // 引入微信 JS-SDK
|
||||
import * as ww from '@wecom/jssdk'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
address: "", // 地址信息
|
||||
latitude: 108.31019592285156, // 纬度
|
||||
longitude: 22.90125274658203, // 经度
|
||||
covers: [{
|
||||
latitude: 108.31019592285156,
|
||||
longitude: 22.90125274658203,
|
||||
iconPath: '../../static/images/applyrelieve/location.png'
|
||||
}],
|
||||
distanceThreshold: 1000, // 距离阈值
|
||||
isLeave: true, // 销假按钮状态
|
||||
taskForm: {},
|
||||
};
|
||||
},
|
||||
async onLoad(option) {
|
||||
console.log(this.role)
|
||||
let query = JSON.parse(option.query);
|
||||
this.taskForm.deployId = query.deployId;
|
||||
this.taskForm.instanceId = query.procInsId
|
||||
this.taskForm.procInsId = query.procInsId
|
||||
this.taskForm.executionId = query.executionId
|
||||
this.taskForm.taskId = query.taskId
|
||||
this.getTaskDetail();
|
||||
await this.initWxConfig(); // 初始化微信配置
|
||||
this.getLocation();
|
||||
},
|
||||
methods: {
|
||||
async initWxConfig() {
|
||||
let that = this;
|
||||
let res = await that.getConfigSignature();
|
||||
ww.register({
|
||||
corpId: 'wx129e6bf0f36b8b3d', // 必填,当前用户企业所属企业ID
|
||||
agentId: 1000093, // 必填,当前应用的AgentID
|
||||
jsApiList: ["getLocation", "openLocation"], // 必填,需要使用的JSAPI列表
|
||||
// getAgentConfigSignature: that.getAgentConfigSignature, // 必填,根据url生成应用签名的回调函数
|
||||
getConfigSignature() {
|
||||
return res
|
||||
}
|
||||
})
|
||||
},
|
||||
// 初始化微信 JS-SDK
|
||||
async getConfigSignature() {
|
||||
return new Promise((resolve, reject) => {
|
||||
// 调用后端接口获取签名信息(需要后端支持)
|
||||
getWxConfig("corpId").then(res => {
|
||||
const {
|
||||
timestamp,
|
||||
nonceStr,
|
||||
signature
|
||||
} = res;
|
||||
resolve({
|
||||
timestamp,
|
||||
nonceStr,
|
||||
signature
|
||||
});
|
||||
}).catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
},
|
||||
// 初始化微信 JS-SDK,应用
|
||||
async getAgentConfigSignature() {
|
||||
return new Promise((resolve, reject) => {
|
||||
// 调用后端接口获取签名信息(需要后端支持)
|
||||
getWxConfig("agentId").then(res => {
|
||||
const {
|
||||
timestamp,
|
||||
nonceStr,
|
||||
signature
|
||||
} = res;
|
||||
resolve({
|
||||
timestamp,
|
||||
nonceStr,
|
||||
signature
|
||||
});
|
||||
}).catch(err => {
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
},
|
||||
// 获取当前位置
|
||||
getLocation() {
|
||||
let that = this;
|
||||
ww.getLocation({
|
||||
type: 'gcj02',
|
||||
success(res) {
|
||||
that.latitude = res.latitude
|
||||
that.longitude = res.longitude
|
||||
that.covers[0].latitude = res.latitude
|
||||
that.covers[0].longitude = res.longitude
|
||||
},
|
||||
fail(err) {
|
||||
uni.showToast({
|
||||
title: "获取定位失败",
|
||||
icon: 'fail'
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
openLocation() {
|
||||
let that = this;
|
||||
ww.openLocation({
|
||||
latitude: that.latitude,
|
||||
longitude: that.longitude,
|
||||
name: 'name',
|
||||
address: 'address',
|
||||
scale: 1,
|
||||
success(res) {},
|
||||
fail(err) {
|
||||
console.log('定位失败:', err)
|
||||
},
|
||||
complete(err) {
|
||||
console.log('定位失败:', err)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 通过经纬度反向解析地址(需要后端支持或使用第三方 API,如高德地图 API)
|
||||
reverseGeocode(lat, lng) {
|
||||
const amapKey = "your-amap-key"; // 替换为高德地图的 API Key
|
||||
this.$http
|
||||
.get(
|
||||
`https://restapi.amap.com/v3/geocode/regeo?key=${amapKey}&location=${lng},${lat}`
|
||||
)
|
||||
.then(res => {
|
||||
if (res.data.regeocode && res.data.regeocode.formatted_address) {
|
||||
this.address = res.data.regeocode.formatted_address;
|
||||
} else {
|
||||
this.address = "未知地址";
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.error("反向地理编码失败", err);
|
||||
this.address = "地址解析失败";
|
||||
});
|
||||
},
|
||||
|
||||
async checkIfNearCampus1() {
|
||||
const campuses = [{
|
||||
name: "长堽校区",
|
||||
latitude: 22.835938,
|
||||
longitude: 108.351728
|
||||
},
|
||||
{
|
||||
name: "里建校区",
|
||||
latitude: 23.206284,
|
||||
longitude: 108.18664
|
||||
}
|
||||
];
|
||||
let isNearby = false;
|
||||
let res = false;
|
||||
|
||||
let campus = campuses[0];
|
||||
let p1 = {
|
||||
latitude: this.latitude,
|
||||
longitude: this.longitude
|
||||
}
|
||||
let distance = this.getDistance(
|
||||
p1.latitude, p1.longitude,
|
||||
campus.latitude, campus.longitude
|
||||
);
|
||||
isNearby = distance < this.distanceThreshold;
|
||||
if (isNearby) {
|
||||
res = true;
|
||||
}
|
||||
|
||||
campus = campuses[1];
|
||||
distance = this.getDistance(
|
||||
p1.latitude, p1.longitude,
|
||||
campus.latitude, campus.longitude
|
||||
);
|
||||
isNearby = distance < this.distanceThreshold;
|
||||
|
||||
if (isNearby) {
|
||||
res = true;
|
||||
}
|
||||
|
||||
if (res) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
toRadians(degree) {
|
||||
return degree * (Math.PI / 180);
|
||||
},
|
||||
|
||||
// 计算两个经纬度之间的距离(近似计算,适用于小范围)
|
||||
getDistance(lat1, lng1, lat2, lng2) {
|
||||
const EARTH_RADIUS = 6378137; // 地球半径,单位:米
|
||||
const dLat = this.toRadians(lat2 - lat1);
|
||||
const dLng = this.toRadians(lng2 - lng1);
|
||||
const a =
|
||||
Math.sin(dLat / 2) * Math.sin(dLat / 2) +
|
||||
Math.cos(this.toRadians(lat1)) *
|
||||
Math.cos(this.toRadians(lat2)) *
|
||||
Math.sin(dLng / 2) *
|
||||
Math.sin(dLng / 2);
|
||||
const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
|
||||
return EARTH_RADIUS * c;
|
||||
},
|
||||
|
||||
// 检查是否在校区范围
|
||||
checkIfNearCampus() {
|
||||
const campuses = [{
|
||||
name: "长堽校区",
|
||||
latitude: 22.835938,
|
||||
longitude: 108.351728
|
||||
},
|
||||
{
|
||||
name: "里建校区",
|
||||
latitude: 23.206284,
|
||||
longitude: 108.18664
|
||||
}
|
||||
];
|
||||
|
||||
const isNearby = campuses.some(campus => {
|
||||
const distance = this.calculateDistance(
|
||||
this.latitude,
|
||||
this.longitude,
|
||||
campus.latitude,
|
||||
campus.longitude
|
||||
);
|
||||
return distance < this.distanceThreshold;
|
||||
});
|
||||
|
||||
if (isNearby) {
|
||||
this.$toast("您在校区范围内,可以进行销假");
|
||||
this.isLeave = false;
|
||||
} else {
|
||||
this.$toast("您不在校区范围内,无法销假");
|
||||
this.isLeave = true;
|
||||
}
|
||||
},
|
||||
|
||||
// 计算两点之间的球面距离
|
||||
calculateDistance(lat1, lng1, lat2, lng2) {
|
||||
const R = 6371000; // 地球半径(单位:米)
|
||||
const toRadians = degrees => (degrees * Math.PI) / 180;
|
||||
const dLat = toRadians(lat2 - lat1);
|
||||
const dLng = toRadians(lng2 - lng1);
|
||||
const a =
|
||||
Math.sin(dLat / 2) * Math.sin(dLat / 2) +
|
||||
Math.cos(toRadians(lat1)) *
|
||||
Math.cos(toRadians(lat2)) *
|
||||
Math.sin(dLng / 2) *
|
||||
Math.sin(dLng / 2);
|
||||
const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
|
||||
return R * c;
|
||||
},
|
||||
|
||||
// 获取销假详情
|
||||
getTaskDetail() {
|
||||
getLeaveApplicationByProcInsId(this.taskForm.procInsId).then(res => {
|
||||
this.leaveApplicationId = res.data.leaveApplicationId;
|
||||
this.address = res.data.destinationDetails;
|
||||
});
|
||||
},
|
||||
|
||||
// 销假操作
|
||||
async confirm() {
|
||||
if (await this.checkIfNearCampus1()) {
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: "确定销假吗?",
|
||||
confirmText: "确定",
|
||||
cancelText: "取消",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
this.taskForm.comment = '销假'
|
||||
complete(this.taskForm).then(res => {
|
||||
if (res.code == 200) {
|
||||
const data = {
|
||||
leaveApplicationId: this.leaveApplicationId,
|
||||
};
|
||||
editApply(data).then(() => {
|
||||
uni.showToast({
|
||||
title: "销假成功",
|
||||
icon: "success",
|
||||
duration: 1500
|
||||
});
|
||||
|
||||
// 延时跳转确保用户看到提示
|
||||
setTimeout(() => {
|
||||
uni.redirectTo({
|
||||
url: "/pages/Approval/index?tab=2"
|
||||
});
|
||||
}, 1600);
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: "销假失败: " + err.message,
|
||||
icon: "none"
|
||||
});
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "您不在学校附近",
|
||||
icon: "error"
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.cancel-leave {
|
||||
.content {
|
||||
.location-info {
|
||||
margin: 10px 0;
|
||||
text-align: center;
|
||||
|
||||
.title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.address {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
||||
.refresh-location {
|
||||
margin: 10px auto;
|
||||
display: block;
|
||||
width: 80%;
|
||||
background-color: #007aff;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.confirm-cancel {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background-color: #1890ff;
|
||||
color: white;
|
||||
border-radius: 0;
|
||||
padding: 10px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
|
||||
&[disabled] {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
864
pages/applyleave/editLeave.vue
Normal file
864
pages/applyleave/editLeave.vue
Normal file
@@ -0,0 +1,864 @@
|
||||
<template>
|
||||
<view class="container" style="padding-bottom: 60px;">
|
||||
<!--学号 -->
|
||||
<view class="form-item">
|
||||
<text class="label">学号:</text>
|
||||
<text class="uni-input">{{ stuInfo.stuNo }}</text>
|
||||
</view>
|
||||
|
||||
<!--姓名 -->
|
||||
<view class="form-item">
|
||||
<text class="label">姓名:</text>
|
||||
<text class="uni-input">{{ stuInfo.studentName }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 性别 -->
|
||||
<view class="form-item">
|
||||
<text class="label">性别:</text>
|
||||
<text class="uni-input">{{ stuInfo.gender }}</text>
|
||||
</view>
|
||||
|
||||
<!--院部 -->
|
||||
<view class="form-item">
|
||||
<text class="label">院部:</text>
|
||||
<text class="uni-input">{{ stuInfo.departmentName }}</text>
|
||||
</view>
|
||||
|
||||
<!--班级 -->
|
||||
<view class="form-item">
|
||||
<text class="label">班级:</text>
|
||||
<text class="uni-input">{{ stuInfo.className }}</text>
|
||||
</view>
|
||||
|
||||
<!--联系电话 -->
|
||||
<view class="form-item">
|
||||
<text class="label">联系电话:</text>
|
||||
<text class="uni-input">{{ stuInfo.phoneNumber }}</text>
|
||||
</view>
|
||||
|
||||
<!--家长姓名 -->
|
||||
<view class="form-item">
|
||||
<text class="label">家长姓名:</text>
|
||||
<text class="uni-input">{{ stuInfo.fatherName }}</text>
|
||||
</view>
|
||||
|
||||
<!--家长联系电话 -->
|
||||
<view class="form-item">
|
||||
<text class="label">家长联系电话:</text>
|
||||
<text class="uni-input">{{ stuInfo.fatherRelation }}</text>
|
||||
</view>
|
||||
<!-- 请假事由 -->
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 请假事由:</text>
|
||||
<picker :range="politicalOptions" v-model="formData.selectedPoliticalIndex" @change="onPoliticalChange">
|
||||
<view class="select">{{ politicalOptions[formData.selectedPoliticalIndex] || '请选择请假事由' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
<!-- 请假事由说明 -->
|
||||
<view class="form-text">
|
||||
<text class="label"> <text class="required">*</text> 请假事由说明:</text>
|
||||
<view class="txt">
|
||||
<uni-forms-item>
|
||||
<uni-easyinput type="textarea" v-model="formData.deeds" maxlength="500" placeholder="输入请假事由说明" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 请假时间 -->
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 请假起始时间:</text>
|
||||
<view class="example-body">
|
||||
<uni-datetime-picker @change="changeDate('start',$event)" returnType="timestamp" v-model="formData.single" />
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 请假结束时间:</text>
|
||||
<view class="example-body">
|
||||
<uni-datetime-picker @change="changeDate('end',$event)" returnType="timestamp" v-model="formData.endsingle" />
|
||||
</view>
|
||||
</view>
|
||||
<!--请假天数 -->
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 请假天数:</text>
|
||||
<input v-model="formData.dataNum" class="uni-input" focus placeholder="请输入请假天数 " />
|
||||
</view>
|
||||
|
||||
<!-- 目的地 -->
|
||||
<view class="form-item">
|
||||
<text class="label"> <text class="required">*</text> 目的地:</text>
|
||||
<input v-model="formData.endAddress" class="uni-input" focus placeholder="请输入目的地 " />
|
||||
</view>
|
||||
<!--详细地址 -->
|
||||
<view class="form-item">
|
||||
<text class="label"><text class="required">*</text> 详细地址:</text>
|
||||
<input v-model="formData.address" class="uni-input" focus placeholder="请输入详细地址 " />
|
||||
</view>
|
||||
<!-- 是否离桂 -->
|
||||
<view class="form-item">
|
||||
<text class="label">是否离桂:</text>
|
||||
<checkbox class="uni-input" :value="isLeaveGui!=null?isLeaveGui.toString():'0'" :checked="isLeaveGui==1?true:false"
|
||||
@click="toggleLG" />
|
||||
</view>
|
||||
<!-- 上传佐证 -->
|
||||
<view class="form-img">
|
||||
<text class="label">上传佐证:</text>
|
||||
<view class="example-body">
|
||||
<uni-file-picker @select="uploadEvidence" v-model="imgVals" @delete="onDelImg" :auto-upload="false"
|
||||
limit="9"></uni-file-picker>
|
||||
</view>
|
||||
</view>
|
||||
<!--协议 -->
|
||||
<view class="form-item">
|
||||
安全承诺书:
|
||||
<text class="labelsafe">《广西水利电力职业技术学院安全承诺书》
|
||||
</text>
|
||||
<label>
|
||||
<checkbox :value="checkboxValue.toString()" @click="toggleCheckbox" />
|
||||
</label>
|
||||
</view>
|
||||
<!-- 签名 -->
|
||||
<view class="form-canvas">
|
||||
<text class="label">手写签字:</text>
|
||||
<view class="sign-img" v-if="signImg!=''">
|
||||
<image :src="signImg" mode=""></image>
|
||||
<text @tap="signToggle">重新签名</text>
|
||||
</view>
|
||||
<view v-else class="sign" @tap="signToggle">
|
||||
点击签名
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">备注:</text>
|
||||
<input v-model="remark" class="uni-input" placeholder="请输入备注" />
|
||||
</view>
|
||||
<!-- 按钮 -->
|
||||
<view class="btn" v-if="type!='task'">
|
||||
<button style="background-color: red;" @click="clean">清除</button>
|
||||
<button style="background-color: #fff; color: #4097FE;border: 1px solid #4097FE;" :disabled="isSubmitting" @click="save">保存</button>
|
||||
<button :disabled="isSubmitting" @click="applyLeave()">提交申请</button>
|
||||
</view>
|
||||
<view class="btn" v-else>
|
||||
<button style="width: 100%;" :disabled="isSubmitting" @tap="resubmitTask">重新提交</button>
|
||||
</view>
|
||||
<uni-popup ref="popup" background-color="#fff">
|
||||
<view class="popup-content" style="height: 35vh;">
|
||||
<liu-signature @change="uploadSign" bgColor="#e8e8e8" lineColor="#000" :width="700"></liu-signature>
|
||||
</view>
|
||||
</uni-popup>
|
||||
<uni-popup class="safety-popup" :is-mask-click="false" ref="safetyPopup" background-color="#fff">
|
||||
<view class="popup-content">
|
||||
<view class="title">
|
||||
请假承诺书
|
||||
</view>
|
||||
<view class="content">
|
||||
<scroll-view scroll-y="true" style="height:300px;">
|
||||
<view class="txt">
|
||||
为进一步加强学生的安全教育和管理,切实维护校园安全及校园秩序,结合我校实际,学生请假外出期间就以下安全事项作如下承诺:
|
||||
<view>
|
||||
1.严格遵守国家法律法规和公民道德行为规范,健康文明生活,不赌博、不打架、不从事非法传销活动、不参与宗教迷信宣传等;不造谣、不传谣、不信谣,不做任何违法违纪行为,自觉维护良好大学生形象。
|
||||
</view>
|
||||
<view>2.自觉遵守学校规章制度,在规定允许时间内出入校园,按时返校;离开宿舍时确认断电和锁好门窗,保管好自己的贵重物品。</view>
|
||||
<view>
|
||||
3.增强安全防范意识,不轻信陌生人,注意防骗、防盗、防抢、防踩踏等,保护人身换人财产安全;不携带易燃易爆等危险品进入公共场所、不在非吸烟区吸烟,不乱扔烟头、不私拉电线,防范消防安全隐患;不买、不吃“三无”食品和野味,确保饮食卫生安全。
|
||||
</view>
|
||||
<view>4.增强安全保护意识,遵守交通规则,乘坐合法正规营运车辆;不到不明水域游泳、戏水、垂钓等。</view>
|
||||
<view>5.增强个人健康安全意识,认真履行个人“健康第一责任人”责任,自觉做好健康监测,身体出现异常情况随时向辅导员和家长报告,及时就医。</view>
|
||||
<view>6.主动与家长、辅导员保持联系,随时保持通讯畅通,并如实告知自己的情况。</view>
|
||||
<view>7.本人承诺已经认真阅读并自愿遵守上述规定,离校期间个人安全将由本人自行负责。</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="time" v-if="safetime>0">
|
||||
请阅读{{safetime}}s承诺书
|
||||
</view>
|
||||
</view>
|
||||
<view class="safety-btn">
|
||||
<button :disabled="isDisabled" @tap="closeSafePopup">我知道了</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadFile from "@/plugins/upload.js";
|
||||
import {
|
||||
baseUrl
|
||||
} from "@/config.js";
|
||||
import {
|
||||
calculateDays,
|
||||
convertToTimestamp
|
||||
} from "@/utils/time-calculation.js"
|
||||
import {
|
||||
editApply,
|
||||
getStuInfo,
|
||||
commonUpload,
|
||||
leaveSave,
|
||||
leaveDetail,
|
||||
addApply
|
||||
} from "@/api/applyleave/applyleave.js";
|
||||
import {
|
||||
getLeaveApplicationByProcInsId,
|
||||
complete
|
||||
} from "@/api/task.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isSubmitting: false, //表单提交标志位
|
||||
isDisabled: true,
|
||||
safetime: 5,
|
||||
// 用户信息
|
||||
stuInfo: {},
|
||||
studID: "",
|
||||
name: "",
|
||||
courtyard: "",
|
||||
sex: '',
|
||||
classroom: "",
|
||||
phone: "",
|
||||
parent: "",
|
||||
parentPhone: "",
|
||||
selectedOptionIndex: -1, // 当前选中的奖项索引
|
||||
politicalOptions: ['因病', '因事'], // 请假选项
|
||||
beginData: '',
|
||||
endData: "",
|
||||
remark: "",
|
||||
leave: ['是', '否'],
|
||||
leaveIndex: -1,
|
||||
url: "",
|
||||
urltwo: "",
|
||||
checkboxValue: 0,
|
||||
//附件
|
||||
attachmentFile: "",
|
||||
signImg: "",
|
||||
imgVals: [],
|
||||
isLeaveGui: 0, //是否离桂
|
||||
formData: {
|
||||
selectedPoliticalIndex: "", // 当前选中的请假索引
|
||||
deeds: "",
|
||||
endsingle: "",
|
||||
single: '',
|
||||
dataNum: "",
|
||||
endAddress: "",
|
||||
address: "",
|
||||
signFile: "",
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
onLoad(option) {
|
||||
this.procInsId = option.id;
|
||||
this.taskId = option.taskId
|
||||
this.type = option.type;
|
||||
if (option.type == 'task') {
|
||||
this.getTaskDetail();
|
||||
} else {
|
||||
this.getLeaveDetail();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toggleLG() {
|
||||
this.isLeaveGui = this.isLeaveGui === 1 ? 0 : 1;
|
||||
},
|
||||
changeDate(type, e) {
|
||||
this.formData.single = convertToTimestamp(this.formData.single);
|
||||
this.formData.endsingle = convertToTimestamp(this.formData.endsingle);
|
||||
if (type == "end") {
|
||||
this.formData.endsingle = e;
|
||||
if (this.formData.endsingle < this.formData.single) {
|
||||
uni.showToast({
|
||||
title: "时间不能早于请假开始时间",
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
this.formData.dataNum = calculateDays(this.formData.single, this.formData.endsingle);
|
||||
} else {
|
||||
this.single = e;
|
||||
if (this.formData.endsingle < this.formData.single) {
|
||||
uni.showToast({
|
||||
title: "起始时间不能晚于结束时间",
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
this.formData.dataNum = calculateDays(this.formData.single, this.formData.endsingle);
|
||||
}
|
||||
},
|
||||
getLeaveDetail() {
|
||||
let sdata = this.procInsId;
|
||||
leaveDetail(sdata).then(res => {
|
||||
this.stuInfo = res.data;
|
||||
this.formData.selectedPoliticalIndex = res.data.leaveType;
|
||||
this.formData.deeds = res.data.reason;
|
||||
this.formData.single = res.data.startDate;
|
||||
this.formData.endsingle = res.data.endDate;
|
||||
this.formData.dataNum = res.data.leaveDays;
|
||||
this.formData.endAddress = res.data.destination;
|
||||
this.formData.address = res.data.destinationDetails;
|
||||
this.formData.signFile = res.data.applicantSignature;
|
||||
this.attachmentFile = res.data.attachment;
|
||||
this.signImg = baseUrl + res.data.applicantSignature;
|
||||
this.remark = res.data.remark;
|
||||
this.leaveApplicationId = res.data.leaveApplicationId;
|
||||
this.isLeaveGui = res.data.leavingGx;
|
||||
console.log(this.formData);
|
||||
if (res.data.attachment != "" && res.data.attachment != null) {
|
||||
let imgs = res.data.attachment.split(',');
|
||||
this.imgVals = imgs.map(img => {
|
||||
return {
|
||||
url: baseUrl + img
|
||||
};
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getTaskDetail() {
|
||||
getLeaveApplicationByProcInsId(this.procInsId).then(res => {
|
||||
this.stuInfo = res.data;
|
||||
this.formData.selectedPoliticalIndex = res.data.leaveType;
|
||||
this.formData.deeds = res.data.reason;
|
||||
this.formData.single = res.data.startDate;
|
||||
this.formData.endsingle = res.data.endDate;
|
||||
this.formData.dataNum = res.data.leaveDays;
|
||||
this.formData.endAddress = res.data.destination;
|
||||
this.formData.address = res.data.destinationDetails;
|
||||
this.attachmentFile = res.data.attachment;
|
||||
this.signImg = baseUrl + res.data.applicantSignature;
|
||||
this.formData.signFile = res.data.applicantSignature;
|
||||
this.remark = res.data.remark;
|
||||
this.leaveApplicationId = res.data.leaveApplicationId;
|
||||
this.isLeaveGui = res.data.leavingGx;
|
||||
if (res.data.attachment != "" && res.data.attachment != null) {
|
||||
let imgs = res.data.attachment.split(',');
|
||||
this.imgVals = imgs.map(img => {
|
||||
return {
|
||||
url: baseUrl + img
|
||||
};
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
// 提交申请
|
||||
applyLeave() {
|
||||
if (this.checkboxValue == 0) {
|
||||
// 如果复选框未被选中,则不允许提交
|
||||
uni.showToast({
|
||||
title: "请勾选承诺书",
|
||||
icon: "error"
|
||||
});
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
if (this.signFile == '') {
|
||||
// 如果复选框未被选中,则不允许提交
|
||||
uni.showToast({
|
||||
title: "请先进行签名",
|
||||
icon: "error"
|
||||
});
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
if (this.endsingle < this.single) {
|
||||
uni.showToast({
|
||||
title: "起始时间不能晚于结束时间",
|
||||
icon: "none"
|
||||
})
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
//表单非空校验
|
||||
const requiredFields = [
|
||||
'selectedPoliticalIndex',
|
||||
'deeds',
|
||||
'endsingle',
|
||||
'single',
|
||||
'dataNum',
|
||||
'endAddress',
|
||||
'address'
|
||||
];
|
||||
const emptyField = requiredFields.find(field => this.formData[field] === ""||this.formData[field] ==null);
|
||||
if (emptyField) {
|
||||
uni.showToast({
|
||||
title: `请填写完必填字段`,
|
||||
icon: "none"
|
||||
})
|
||||
return;
|
||||
}
|
||||
console.log(this.formData);
|
||||
uni.showLoading({
|
||||
title: "正在提交"
|
||||
})
|
||||
let data = {
|
||||
applicantSignature: this.formData.signFile,
|
||||
attachment: this.attachmentFile,
|
||||
destination: this.formData.endAddress,
|
||||
destinationDetails: this.formData.address,
|
||||
startDate: this.formData.single,
|
||||
endDate: this.formData.endsingle,
|
||||
leaveDays: this.formData.dataNum,
|
||||
leaveType: this.formData.selectedPoliticalIndex,
|
||||
reason: this.formData.deeds,
|
||||
remark: this.remark,
|
||||
safetyPromise: 1,
|
||||
leaveApplicationId: this.leaveApplicationId,
|
||||
leavingGx:this.isLeaveGui
|
||||
}
|
||||
this.isSubmitting = true; // 设置为正在提交
|
||||
if (this.type == "task") {
|
||||
editApply(data).then(res => {
|
||||
if (res.code == 200) {
|
||||
let sData = {
|
||||
taskId: this.taskId,
|
||||
comment: "",
|
||||
}
|
||||
complete(sData).then(res => {
|
||||
console.log(res);
|
||||
if (res.code == 200) {
|
||||
uni.hideLoading();
|
||||
this.isSubmitting = false;
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length > 0) {
|
||||
const prevPage = pages[pages.length - 2]
|
||||
if (prevPage && typeof prevPage.getList ===
|
||||
'function') {
|
||||
prevPage.handleChange(2);
|
||||
console.log('刷新已办任务数据');
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "提交失败,请先填写完整内容",
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
addApply(data).then(res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: "提交成功",
|
||||
icon: "success"
|
||||
});
|
||||
this.isSubmitting = false;
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length > 0) {
|
||||
const prevPage = pages[pages.length - 2]
|
||||
if (prevPage && typeof prevPage.getLeaveList ===
|
||||
'function') {
|
||||
prevPage.getLeaveList();
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "提交失败,请先填写完整内容",
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
// 重新提交任务
|
||||
resubmitTask() {
|
||||
this.applyLeave();
|
||||
},
|
||||
//上传佐证
|
||||
uploadEvidence(e) {
|
||||
uploadFile('/common/upload', e.tempFilePaths[0]).then((res) => {
|
||||
console.log(this.attachmentFile);
|
||||
if (this.attachmentFile !== "") {
|
||||
this.attachmentFile = this.attachmentFile + "," + JSON.parse(res).fileName;
|
||||
} else {
|
||||
this.attachmentFile = JSON.parse(res).fileName;
|
||||
}
|
||||
console.log(this.attachmentFile);
|
||||
})
|
||||
},
|
||||
//删除已选图片
|
||||
onDelImg(e) {
|
||||
let newImgs = this.imgVals.filter(fileName => fileName.path !== e.tempFilePath);
|
||||
newImgs = newImgs.map(img => img.url.replace(baseUrl, ''))
|
||||
newImgs = newImgs.join(",");
|
||||
this.attachmentFile = newImgs;
|
||||
},
|
||||
//上传签名
|
||||
uploadSign(e) {
|
||||
const blob = this.base64ToBlob(e);
|
||||
const fileObj = new File([blob], 'signature', {
|
||||
type: 'image/png'
|
||||
});
|
||||
const formData = new FormData();
|
||||
formData.append("file", fileObj);
|
||||
const formDataObj = this.formDataToObject(formData);
|
||||
uploadFile('/common/upload', '', formDataObj).then((res) => {
|
||||
this.formData.signFile = JSON.parse(res).fileName;
|
||||
this.signImg = baseUrl + JSON.parse(res).fileName;
|
||||
this.$refs.popup.close('center')
|
||||
})
|
||||
},
|
||||
// onPickerChange(event) {
|
||||
// this.selectedOptionIndex = event.detail.value;
|
||||
// },
|
||||
onPoliticalChange(event) {
|
||||
this.formData.selectedPoliticalIndex = event.detail.value;
|
||||
},
|
||||
toggleCheckbox() {
|
||||
// 切换 checkboxValue 的值
|
||||
this.checkboxValue = this.checkboxValue === 1 ? 0 : 1;
|
||||
if (this.checkboxValue) {
|
||||
this.$refs.safetyPopup.open('center')
|
||||
if (this.safetime > 0) {
|
||||
const intervalId = setInterval(() => {
|
||||
this.safetime--;
|
||||
console.log(this.safetime);
|
||||
if (this.safetime === 0) {
|
||||
clearInterval(intervalId); // 停止倒计时
|
||||
this.isDisabled = false;
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 清空表单
|
||||
clean() {
|
||||
this.studID = "";
|
||||
this.name = "";
|
||||
this.courtyard = "";
|
||||
this.formData.selectedOptionIndex = "";
|
||||
this.classroom = '';
|
||||
this.phone = '';
|
||||
this.parent = '';
|
||||
this.parentPhone = "";
|
||||
this.formData.selectedPoliticalIndex = ""
|
||||
this.beginData = "";
|
||||
this.endData = '';
|
||||
this.formData.dataNum = '';
|
||||
this.formData.deeds = '';
|
||||
this.leaveIndex = -1;
|
||||
this.formData.endAddress = '';
|
||||
this.formData.address = '';
|
||||
this.isChecked = false;
|
||||
this.$forceUpdate(); // 强制更新组件
|
||||
this.url = ''
|
||||
localStorage.removeItem('formData');
|
||||
},
|
||||
//保存假条信息
|
||||
save() {
|
||||
if (this.checkboxValue == 0) {
|
||||
// 如果复选框未被选中,则不允许提交
|
||||
uni.showToast({
|
||||
title: "请勾选承诺书",
|
||||
icon: "error"
|
||||
});
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
if (this.formData.signFile == '' || this.formData.signFile == null) {
|
||||
// 如果复选框未被选中,则不允许提交
|
||||
uni.showToast({
|
||||
title: "请先进行签名",
|
||||
icon: "error"
|
||||
});
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
if (this.formData.endsingle < this.formData.single) {
|
||||
uni.showToast({
|
||||
title: "起始时间不能晚于结束时间",
|
||||
icon: "none"
|
||||
})
|
||||
return; // 阻止表单提交
|
||||
}
|
||||
//表单非空校验
|
||||
const requiredFields = [
|
||||
'selectedPoliticalIndex',
|
||||
'deeds',
|
||||
'endsingle',
|
||||
'single',
|
||||
'dataNum',
|
||||
'endAddress',
|
||||
'address'
|
||||
];
|
||||
const emptyField = requiredFields.find(field => this.formData[field] === ""||this.formData[field] ==null);
|
||||
if (emptyField) {
|
||||
uni.showToast({
|
||||
title: `请填写完必填字段`,
|
||||
icon: "none"
|
||||
})
|
||||
return;
|
||||
}
|
||||
this.isSubmitting=true;
|
||||
let data = {
|
||||
applicantSignature: this.formData.signFile,
|
||||
attachment: this.attachmentFile,
|
||||
destination: this.formData.endAddress,
|
||||
destinationDetails: this.formData.address,
|
||||
endDate: this.formData.endsingle,
|
||||
leaveDays: this.formData.dataNum,
|
||||
leaveType: this.formData.selectedPoliticalIndex,
|
||||
reason: this.formData.deeds,
|
||||
remark: this.remark,
|
||||
safetyPromise: 1,
|
||||
startDate: this.formData.single,
|
||||
leaveApplicationId: this.procInsId,
|
||||
leavingGx:this.isLeaveGui
|
||||
}
|
||||
|
||||
leaveSave(data).then(res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: "保存成功",
|
||||
icon: "success"
|
||||
});
|
||||
this.isSubmitting=false;
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length > 0) {
|
||||
const prevPage = pages[pages.length - 2]
|
||||
if (prevPage && typeof prevPage.getLeaveList ===
|
||||
'function') {
|
||||
prevPage.getLeaveList();
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "提交失败,请先填写完整内容",
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
signToggle() {
|
||||
this.$refs.popup.open('center')
|
||||
},
|
||||
closeSafePopup() {
|
||||
this.$refs.safetyPopup.close('center')
|
||||
this.safetime = 5;
|
||||
},
|
||||
base64ToBlob(base64String) {
|
||||
const byteCharacters = atob(base64String.split(',')[1]);
|
||||
const byteNumbers = new Array(byteCharacters.length);
|
||||
for (let i = 0; i < byteCharacters.length; i++) {
|
||||
byteNumbers[i] = byteCharacters.charCodeAt(i);
|
||||
}
|
||||
|
||||
const byteArray = new Uint8Array(byteNumbers);
|
||||
return new Blob([byteArray], {
|
||||
type: 'application/octet-stream'
|
||||
});
|
||||
},
|
||||
formDataToObject(formData) {
|
||||
const obj = {};
|
||||
formData.forEach((value, key) => {
|
||||
obj[key] = value;
|
||||
});
|
||||
return obj;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 10rpx;
|
||||
|
||||
}
|
||||
|
||||
.form-item {
|
||||
width: 95%;
|
||||
height: 80rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
justify-content: space-between;
|
||||
|
||||
checkbox {
|
||||
/deep/.uni-checkbox-input.uni-checkbox-input-checked {
|
||||
background: #007aff;
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
text:last-child {
|
||||
text-wrap: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.form-text {
|
||||
width: 95%;
|
||||
margin-bottom: 20rpx;
|
||||
border-bottom: 1px solid #ededee;
|
||||
}
|
||||
|
||||
.form-img {
|
||||
width: 95%;
|
||||
margin-bottom: 20rpx;
|
||||
border-bottom: 1px solid #ededee;
|
||||
}
|
||||
|
||||
.example-body {
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.txt {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
text-align: right;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.select {
|
||||
color: #888889;
|
||||
white-space: nowrap;
|
||||
/* 防止换行 */
|
||||
overflow: hidden;
|
||||
/* 隐藏溢出部分 */
|
||||
text-overflow: ellipsis;
|
||||
/* 显示省略号 */
|
||||
}
|
||||
|
||||
.uni-input {
|
||||
color: #888889;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
margin: 0 auto;
|
||||
border-top: 1px solid #d6d6d6;
|
||||
background: #fff;
|
||||
padding: 10px;
|
||||
right: 0;
|
||||
|
||||
button {
|
||||
width: 30%;
|
||||
background-color: #1890FF;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.form-address {
|
||||
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.labelsafe {
|
||||
color: red;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.form-canvas {
|
||||
width: 95%;
|
||||
margin-bottom: 25px;
|
||||
|
||||
.sign-img {
|
||||
position: relative;
|
||||
margin-top: 8px;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
text {
|
||||
position: absolute;
|
||||
right: 9px;
|
||||
bottom: 10px;
|
||||
background: white;
|
||||
padding: 3px 5px;
|
||||
border-radius: 2px;
|
||||
color: #5c5c5c;
|
||||
}
|
||||
}
|
||||
|
||||
.sign {
|
||||
margin-top: 8px;
|
||||
border: 1px solid #ebebeb;
|
||||
padding: 25px;
|
||||
color: #1e6fff;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-box {
|
||||
width: 80%;
|
||||
height: 100vh;
|
||||
background-color: #f0f0f0;
|
||||
|
||||
.success-img {
|
||||
width: 90%;
|
||||
height: 300rpx;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.safety-popup {
|
||||
scroll-view {
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
width: 90vw;
|
||||
box-sizing: border-box;
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.content {
|
||||
color: #7e7e7e;
|
||||
padding: 0 25px 0 25px;
|
||||
line-height: 25px;
|
||||
|
||||
.time {
|
||||
text-align: center;
|
||||
margin-top: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.safety-btn {
|
||||
margin-top: 20px;
|
||||
border-top: 1px solid #b6b6b6;
|
||||
padding: 5px 0;
|
||||
|
||||
button {
|
||||
&::after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
231
pages/applyleave/list.vue
Normal file
231
pages/applyleave/list.vue
Normal file
@@ -0,0 +1,231 @@
|
||||
<template>
|
||||
<view class="leave-list">
|
||||
<view class="head" @tap="toAddApply">
|
||||
<view class="add">
|
||||
<uni-icons type="plus" size="28"></uni-icons>新增
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view class="item" v-for="(leave,index) in leaveLists" :key="index">
|
||||
<view>
|
||||
<text class="label">学号</text>
|
||||
<text>{{leave.stuNo}}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="label">姓名</text>
|
||||
<text>{{leave.name}}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="label">请假信息</text>
|
||||
<text>{{leave.leaveType==1?'事假':'病假'}}/{{leave.reason}}/共{{leave.leaveDays}}天</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="label">起止时间</text>
|
||||
<text>{{leave.startDate}}~{{leave.endDate}}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="label">申请时间</text>
|
||||
<text>{{leave.createTime}}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="label">假条状态</text>
|
||||
<text>{{leave.leaveStatus==1?'已提交':'保存中'}}</text>
|
||||
</view>
|
||||
<view class="status">
|
||||
<view class="left">
|
||||
<text class="primary" v-if="leave.status == 0">待审批</text>
|
||||
<text class="success" v-else-if="leave.status == 1">已通过</text>
|
||||
<text class="warn" v-else-if="leave.status == 2">已驳回</text>
|
||||
<text class="warn" v-if="leave.cancellation == 0">未销假</text>
|
||||
<text class="primary" v-else-if="leave.cancellation == 1">销假申请中</text>
|
||||
<text class="success" v-else-if="leave.cancellation == 2">已销假</text>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="edit" @tap="onEdit(leave.leaveApplicationId)" v-if="leave.leaveStatus==0">
|
||||
<!-- compose -->
|
||||
<uni-icons color="#1890ff" type="compose" size="18"></uni-icons>
|
||||
修改
|
||||
</view>
|
||||
<view class="del" v-if="leave.leaveStatus==0" @tap="onDel(leave.leaveApplicationId)">
|
||||
<uni-icons color="#ff2019" type="trash" size="18"></uni-icons>
|
||||
删除
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="cancellation-leave" @tap="toCancellationLeave">
|
||||
销假
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
leaveList,
|
||||
leaveDel
|
||||
} from "@/api/applyleave/applyleave.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
leaveLists: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getLeaveList()
|
||||
},
|
||||
methods: {
|
||||
// //销假
|
||||
toCancellationLeave(){
|
||||
uni.navigateTo({
|
||||
url:"/pages/applyleave/cancellationLeave"
|
||||
})
|
||||
},
|
||||
toAddApply() {
|
||||
uni.navigateTo({
|
||||
url: "/pages/applyleave/applyleave"
|
||||
})
|
||||
},
|
||||
getLeaveList() {
|
||||
leaveList().then(res => {
|
||||
console.log(res);
|
||||
this.leaveLists = res.rows;
|
||||
})
|
||||
},
|
||||
onDel(id) {
|
||||
uni.showModal({
|
||||
title: "确定删除吗?",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
leaveDel(id).then(res => {
|
||||
console.log(res);
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: "删除成功"
|
||||
})
|
||||
this.getLeaveList();
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: "删除失败"
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
onEdit(id) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/applyleave/editLeave?id=" + id
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.leave-list {
|
||||
min-height: 100vh;
|
||||
background-color: #F6F6F6;
|
||||
padding: 15px;
|
||||
padding-top: 55px;
|
||||
|
||||
.head {
|
||||
background-color: white;
|
||||
margin-bottom: 15px;
|
||||
padding: 8px 25px;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
border-top: 1px solid #e9e4e6;
|
||||
box-sizing: border-box;
|
||||
/* #ifndef MP-WEIXIN */
|
||||
top: 44px;
|
||||
/* #endif */
|
||||
/* #ifdef MP-WEIXIN */
|
||||
top: 0;
|
||||
/* #endif */
|
||||
.add {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
.item {
|
||||
background-color: white;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
&>view {
|
||||
font-size: 32rpx;
|
||||
.right{
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
.edit {
|
||||
color: #1890ff;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.del {
|
||||
color: #ff2019;
|
||||
}
|
||||
}
|
||||
&:not(:first-child) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
&.status {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 10px;
|
||||
text {
|
||||
padding: 4px 5px;
|
||||
border-radius: 5px;
|
||||
font-size: 28rpx;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.left {
|
||||
text {
|
||||
margin-right: 5px;
|
||||
|
||||
&.success {
|
||||
color: #55aa00;
|
||||
background-color: rgba(85, 170, 0, 0.1);
|
||||
}
|
||||
|
||||
&.primary {
|
||||
color: #55aaff;
|
||||
background-color: rgba(85, 170, 255, 0.2);
|
||||
}
|
||||
|
||||
&.warn {
|
||||
color: #ff0000;
|
||||
background-color: rgba(255, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.label {
|
||||
color: #B1B1B1;
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
.cancellation-leave{
|
||||
padding: 15px 0 0 0;
|
||||
text-align: center;
|
||||
border-top: 1px solid #b6b6b6;
|
||||
color: #55aaff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user