Skip to content

P
psa-web
Commit c6397685 authored by yanzhengyang's avatar yanzhengyang
Browse files
Options

填报工时页面显示效果修改

parent ff9706a3
Hide whitespace changes
Inline Side-by-side
Showing with 92 additions and 76 deletions
src/views/timesheet/timesheet/index.vue
View file @ c6397685
...@@ -24,76 +24,83 @@ ...@@ -24,76 +24,83 @@
</el-row> </el-row>
</div> </div>
<div class="back" > <div class="back" >
<div class="cards-container"> <div class="cards-container">
<!-- 表单样式 --> <!-- 表单样式 -->
<el-card class="card" <el-row :gutter="20">
shadow="never" <el-col :span="12"
v-loading="loading" v-for="(project, index) in personalTimesheetList"
v-for="(project, index) in personalTimesheetList" :key="index">
:key="index"> <el-card class="card"
<template #header> shadow="never"
<div class="card-header" > v-loading="loading">
<p> <template #header>
<label class="writedate1">{{ project.projectName }}</label> <div class="card-header" >
<lable class="manager">项目经理：{{ project.managerName }}</lable> <p>
<lable class="depart">事业部负责人：{{ project.departmentLeaderName }}</lable> <label class="writedate1">{{ project.projectName }}</label>
<label v-if="project.approvalState === 1 " class="state">已通过</label> <lable class="manager">项目经理：{{ project.managerName }}</lable>
<label v-if="project.approvalState === 0 " class="state2">被驳回</label> <lable class="depart">事业部负责人：{{ project.departmentLeaderName }}</lable>
<label v-if="project.approvalState === 2 " class="state">待填报</label> </p>
<label v-if="project.approvalState === 3 " class="state">审核中</label> <p>
<label v-show="project.approvalState === 0" class="state2">{{ project.approvalNote }}</label> <label v-if="project.approvalState === 1 " class="state">已通过</label>
</p> <label v-if="project.approvalState === 0 " class="state2">被驳回</label>
</div> <label v-if="project.approvalState === 2 " class="state">待填报</label>
</template> <label v-if="project.approvalState === 3 " class="state">审核中</label>
<span class="timesheet">工时明细</span> <label v-show="project.approvalState === 0" class="state2">{{ project.approvalNote }}</label>
<label v-if="project.approvalState === 0" class="note">驳回理由：{{ project.approvalNote }}</label> </p>
<!-- 工时明细详情 --> </div>
<div class="timedetile"> </template>
<el-row> <span class="timesheet">工时明细</span>
<div class="d1" <label v-if="project.approvalState === 0" class="note">驳回理由：{{ project.approvalNote }}</label>
v-for="day in project.addWorkList" <!-- 工时明细详情 -->
:key="day.workTime"> <div class="timedetile">
<el-row class="d1-1"> <el-row>
<el-col :span="24" class="row-container"> <div class="d1"
<label class="d1-week1">{{ day.workTime }}</label> v-for="day in project.addWorkList"
</el-col> :key="day.workTime">
<el-col :span="24" class="row-container"> <el-row class="d1-1">
<label class="d1-date">{{ day.workWeek }}</label> <el-col :span="24" class="row-container">
</el-col> <label class="d1-week1">{{ day.workTime }}</label>
</el-row> </el-col>
<el-row class="d1-2"> <el-col :span="24" class="row-container">
<el-input class="d1-input" <label class="d1-date">{{ day.workWeek }}</label>
v-if="project.approvalState === 2 || project.approvalState === 0" </el-col>
v-model.number="day.hours" </el-row>
type="number" <el-row class="d1-2">
min="0" <el-input class="d1-input"
max="8" v-if="project.approvalState === 2 || project.approvalState === 0"
step="0.5" v-model.number="day.hours"
placeholder="请填入工时" type="number"
@input="updateProjectTotalHours(project)"> min="0"
</el-input> max="8"
<!-- 如果项目状态为已提交，只显示工时 --> step="0.5"
<span v-else>{{ day.hours }}</span> placeholder="请填入工时"
@input="updateProjectTotalHours(project)">
</el-input>
<!-- 如果项目状态为已提交，只显示工时 -->
<span v-else>{{ day.hours }}</span>
</el-row>
</div>
</el-row> </el-row>
</div> </div>
</el-row> <template #footer>
</div> <div class="foot" >
<template #footer> <div>
<div class="foot" > <label class="foot1">项目总工时：</label>
<label class="foot1">项目总工时：</label> <label class="foot2">{{ project.totalHours }}</label>
<label class="foot2">{{ project.totalHours }}</label> </div>
<el-button class="button-submit" <el-button class="button-submit"
type="primary" type="primary"
plain plain
:disabled="!(isAllowedDay.value)" :disabled="!(isAllowedDay.value)"
v-show="project.approvalState === 2 || project.approvalState === 0 || isAllowedDay.value" v-show="project.approvalState === 2 || project.approvalState === 0 || isAllowedDay.value"
@click="submit(project)"> @click="submit(project)">
<el-icon><Tickets /></el-icon>提交 <el-icon><Tickets /></el-icon>提交
</el-button> </el-button>
</div> </div>
</template> </template>
</el-card> </el-card>
</el-col>
</el-row>
<!-- 提交弹出框--> <!-- 提交弹出框-->
<el-dialog class="dia-tip" v-model="dialogSubmit" title="提示" > <el-dialog class="dia-tip" v-model="dialogSubmit" title="提示" >
...@@ -445,15 +452,19 @@ function handleExport() { ...@@ -445,15 +452,19 @@ function handleExport() {
<style scoped> <style scoped>
.card{ .card{
min-width: 770px; width: 770px;
height: 350px; height: 350px;
background: #F9F9FA; background: #F9F9FA;
border: 1px solid #E1E1E1; border: 1px solid #E1E1E1;
margin-left: 28px; margin-left: 10px;
margin-right: 43px;
margin-top: 18px; margin-top: 18px;
} }
.card-header{
display: flex;
justify-content: space-between;
}
.writedate1{ .writedate1{
margin-left: 28px; margin-left: 28px;
margin-top: 22px; margin-top: 22px;
...@@ -513,6 +524,11 @@ tbody td { ...@@ -513,6 +524,11 @@ tbody td {
font-size: 18px; /* 单元格内容字号设为18px */ font-size: 18px; /* 单元格内容字号设为18px */
} }
.foot{
display: flex;
justify-content: space-between;
}
.foot1{ .foot1{
margin-left: 28px; margin-left: 28px;
margin-top: auto; margin-top: auto;
...@@ -550,26 +566,21 @@ tbody td { ...@@ -550,26 +566,21 @@ tbody td {
background: #F2F6FF; background: #F2F6FF;
box-shadow: 0 2px 4px 0 #00000021; box-shadow: 0 2px 4px 0 #00000021;
border-radius: 2px; border-radius: 2px;
margin-left: 490px;
} }
/*审批状态*/ /*审批状态*/
.state{ .state{
margin-left: 217px;
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
font-weight: 400; font-weight: 400;
font-size: 18px; font-size: 18px;
color: #FF9F0D; color: #FF9F0D;
letter-spacing: 0;
line-height: 12px; line-height: 12px;
} }
.state2{ .state2{
margin-left: 217px;
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
font-weight: 400; font-weight: 400;
font-size: 18px; font-size: 18px;
color: #FF0000; color: #FF0000;
letter-spacing: 0;
line-height: 12px; line-height: 12px;
} }
.note{ .note{
...@@ -635,10 +646,15 @@ tbody td { ...@@ -635,10 +646,15 @@ tbody td {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden;
height: 780px; height: 780px;
width: 100%; width: 100%;
} }
.cards-container::-webkit-scrollbar {
display: none;
}
/*底部*/ /*底部*/
.back{ .back{
display: flex; display: flex;
...@@ -763,7 +779,7 @@ th, td { ...@@ -763,7 +779,7 @@ th, td {
.d1-1{ .d1-1{
display: flex; display: flex;
width: 143px; width: 138px;
height: 70px; height: 70px;
margin-left: 6px; margin-left: 6px;
background: #F0F0F0; background: #F0F0F0;
...@@ -776,7 +792,7 @@ th, td { ...@@ -776,7 +792,7 @@ th, td {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin-left: 6px; margin-left: 6px;
width: 143px; width: 138px;
height: 60px; height: 60px;
background: #F9F9FA; background: #F9F9FA;
border: 1px solid #DEDEDE; border: 1px solid #DEDEDE;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment