sdz/shihezi-employment-service
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

flat: 提交维权申请

Browse Source
This commit is contained in:
yangxiao
2025-12-28 19:48:00 +08:00
parent 2fc924d601
commit 63883356b1
15 changed files with 2223 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

304
packageA/pages/rightsProtectionApplication/rightsProtectionApplication.vue Normal file
View File

@@ -0,0 +1,304 @@
<template>
<AppLayout title="申请信息提交" :use-scroll-view="false" :show-bg-image="false">
<template #headerleft >
<view class="btnback">
<image src="@/static/icon/back.png" @click="navBack"></image>
</view>
</template>
<view class="app-container">
<view class="personal-info">
<view class="personal-info-title">个人基本信息</view>
<view class="personal-info-list">
<view class="personal-info-list-l">
<span>*</span> 姓名
</view>
<view class="personal-info-list-r">
<input :value="userInfo.name" class="uni-input" placeholder="请输入你的姓名" />
</view>
</view>
<view class="personal-info-list">
<view class="personal-info-list-l"><span>*</span>联系方式</view>
<view class="personal-info-list-r">
<input :value="userInfo.phone" class="uni-input" placeholder="请输入联系方式" />
</view>
</view>
<view class="personal-info-list">
<view class="personal-info-list-l"><span>*</span>身份证号</view>
<view class="personal-info-list-r">
<input :value="userInfo.idNumber" class="uni-input" placeholder="请输入身份证号" />
</view>
</view>
</view>
<view class="personal-info">
<view class="personal-info-title">工作单位相关信息</view>
<view class="personal-info-list">
<view class="personal-info-list-l"> 工作单位名称</view>
<view class="personal-info-list-r">
<input class="uni-input" placeholder="请输入工作单位名称" />
</view>
</view>
<view class="personal-info-list">
<view class="personal-info-list-l">工作单位地址</view>
<view class="personal-info-list-r">
<input class="uni-input" placeholder="请输入工作单位地址" />
</view>
</view>
</view>
<view class="personal-info">
<view class="personal-info-title">劳动关系存续期间</view>
<view class="personal-info-list">
<view class="personal-info-list-l"> 开始时间</view>
<view class="personal-info-list-r" @click="changestartTime">
<!-- <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
<view class="uni-input">{{date}}</view>
</picker> -->
<input class="uni-input" :value="startDate" placeholder="开始时间" />
</view>
</view>
<view class="personal-info-list">
<view class="personal-info-list-l">结束时间</view>
<view class="personal-info-list-r" @click="changeendTime">
<input class="uni-input" :value="endDate" placeholder="结束时间" />
</view>
</view>
</view>
<view class="personal-info">
<view class="personal-info-title">侵权情况描述</view>
<view class="personal-info-list">
<view class="personal-info-list-l"> 描述内容</view>
<view class="personal-info-list-r">
<textarea placeholder="请输入描述内容" />
</view>
</view>
</view>
<view class="personal-info">
<view class="personal-info-title" @click="open">证据材料上传</view>
</view>
<button class="tijiao tijiao-pos" @click="tijiao1">提交申请</button>
<uni-popup ref="popup" type="bottom" >
<view class="popup-container">
<view class="popup-container-title"><h3>证据材料上传</h3></view>
<view class="popup-container-list">
<view class="popup-container-list-title">劳动合同</view>
<view style="padding: 10rpx;">
<uni-file-picker file-mediatype="all"><button class="button" size="mini">选择文件</button></uni-file-picker>
</view>
</view>
<view class="popup-container-list">
<view>工资条</view>
<view style="padding: 10rpx;">
<uni-file-picker file-mediatype="all"><button class="button1" size="mini">选择文件</button></uni-file-picker>
</view>
</view>
<view class="popup-container-list">
<view>考勤记录</view>
<view style="padding: 10rpx;">
<uni-file-picker file-mediatype="all"><button class="button2" size="mini">选择文件</button></uni-file-picker>
</view>
</view>
<view class="popup-container-list">
<view>沟通记录截图</view>
<view style="padding: 10rpx;">
<uni-file-picker file-mediatype="all"><button class="button3" size="mini">选择文件</button></uni-file-picker>
</view>
</view>
<view style="padding-top: 20rpx;">
<button class="tijiao" @click="tijiao">提交材料</button>
</view>
</view>
</uni-popup>
<DatePicker ref="datePicker" />
</view>
</AppLayout>
</template>
<script setup>
import { reactive, inject,computed, watch, ref, onMounted } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
const { $api, debounce, throttle, navBack, safeReLaunch } = inject('globalFunction');
import { storeToRefs } from 'pinia';
import useUserStore from '@/stores/useUserStore';
import DatePicker from '@/components/DatePicker/DatePicker.vue';
import { navTo } from '../../../common/globalFunction';
const { userInfo } = storeToRefs(useUserStore());
// 获取时间选择器组件的引用
const datePicker = ref();
const popup = ref()
const active = ref(1)
const startDate = ref(null)
const endDate = ref(null)
// 选择开始时间
const changestartTime = () => {
datePicker.value.open({
title: '选择开始时间',
success: (selectedDate) => {
startDate.value = selectedDate;
},
});
};
// 选择结束时间
const changeendTime = () => {
datePicker.value.open({
title: '选择结束时间',
success: (selectedDate) => {
endDate.value = selectedDate;
if (startDate.value && new Date(startDate.value) > new Date(selectedDate)) {
endDate.value = '';
$api.msg('结束时间不能小于开始时间!');
}
},
});
}
const open = () =>{
popup.value.open('bottom')
}
const tijiao = () => {
popup.value.close()
}
onMounted(() => {
});
const tijiao1 = () => {
safeReLaunch('/pages/index/index')
}
</script>
<style lang="stylus" scoped>
.btnback{
width: 64rpx;
height: 64rpx;
}
image {
height: 100%;
width: 100%;
}
.app-container{
width: 100%;
height: 100%;
background: #EEE;
display: flex;
padding-top: 10rpx;
flex-direction: column;
.personal-info {
width: 100%;
background: #fff;
padding: 20rpx;
margin-bottom: 10rpx;
.personal-info-title {
width: 100%;
// padding: 10rpx 0;
font-size: 28rpx;
font-weight: bold;
}
.personal-info-list {
width: 100%;
display: flex;
padding: 10rpx 0;
border-bottom: 1px solid #EEE;
.personal-info-list-l {
width: 200rpx;
color: #B0B0B0;
font-weight: bolder !important;
padding-right: 20rpx;
span {
color: red;
}
}
.personal-info-list-r {
flex: 1;
}
}
}
}
.steps {
height: 200rpx;
}
.popup-container {
height: 800rpx;
width: 100%;
height: 100%;
overflow: auto;
background: #fff;
.popup-container-title {
width: 100%;
text-align: center;
height: 80rpx;
line-height: 80rpx;
color: #B0B0B0;
font-weight: bolder !important;
}
}
.popup-container-list {
padding: 0 20rpx;
padding-top: 20rpx;
border-bottom: 1px solid #EEE;
}
.popup-container-list-title {
font-size: 28rpx;
font-weight: blod;
}
.button {
border: none !important;
background: #EEF2FF;
color: #4338CA;
}
.button1 {
border: none !important;
background: #F0FDF4;
color: #288B4C;
}
.button2 {
border: none !important;
background: #FEFCE8;
color: #A76C17;
}
.button3 {
border: none !important;
background: #FEF2F2;
color: #C23B3B;
}
.tijiao {
width: 80%;
background: #58BE6B;
color: #fff;
}
.tijiao-pos {
position: absolute;
bottom: 100rpx;
left: 10%;
}
</style>