223 lines
6.6 KiB
Vue
223 lines
6.6 KiB
Vue
<template>
|
|
<view class="">
|
|
<!-- #ifndef MP-WEIXIN -->
|
|
<u-navbar title="人工工时" :autoBack="true" :safeAreaInsetTop="true" bgColor="#eee" color="#fff"
|
|
leftIconColor="#000" rightText="添加" titleStyle="color:#000;font-weight:bold;" placeholder
|
|
@rightClick="handleAdd">
|
|
</u-navbar>
|
|
<!-- #endif -->
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<view class="addBtn" @click="handleAdd">
|
|
+
|
|
</view>
|
|
<!-- #endif -->
|
|
<!-- <view class=" background-color-fff box-sizing-border-box padding-20">
|
|
<u-search></u-search>
|
|
</view> -->
|
|
<template v-if="costEmployeeList.length>0">
|
|
<view v-for="(item,index) in costEmployeeList" :key="index">
|
|
<view class="flex aic jcsa background-color-fff margin-top-20">
|
|
<view class="width-100 flex jcc ">
|
|
<u-icon name="account-fill" size="28" color="#2b7"></u-icon>
|
|
</view>
|
|
<view class="width-390 padding-20">
|
|
<view class="">
|
|
{{ transformEmployeeName(item.employeeId) }}
|
|
</view>
|
|
<view class="">
|
|
{{item.workingHours}}小时
|
|
</view>
|
|
<view class="font-size-25 font-color-l3">
|
|
{{item.workingStart}}到{{item.workingFinish}}
|
|
</view>
|
|
</view>
|
|
<view class="font-size-28 flex1 padding-right-20 font-color-2b7 flex jcsb">
|
|
<view @click="edit(item.costId)"
|
|
class="border-radius-10 background-color-2b7 font-color-fff padding-tb-10 padding-lr-20">
|
|
查看
|
|
</view>
|
|
<view @click="del(item.costId)"
|
|
class="border-radius-10 background-color-danger font-color-fff padding-tb-10 padding-lr-20">
|
|
删除
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<!-- 无数据控件 -->
|
|
<u-empty v-else mode="data" icon="https://cdn.uviewui.com/uview/empty/data.png"/>
|
|
<!-- 弹出层 -->
|
|
<u-popup :show="popupVisiable" @close="popupVisiable=false" closeable closeOnClickOverlay>
|
|
<view class="padding-70">
|
|
<uni-forms ref="form" :rules="rules" :model="form">
|
|
<uni-forms-item label="工时" name="workingHours" type="number">
|
|
<uni-easyinput type="text" v-model="form.workingHours" primaryColor="#2b7" placeholder="请输入工时" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="雇员" name="employeeId">
|
|
<uni-data-select v-model="form.employeeId" :localdata="fmtEmployeeList" placeholder="请选择雇员"></uni-data-select>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="开始时间" name="workingStart">
|
|
<uni-datetime-picker type="date" :clear-icon="false" v-model="form.workingStart" placeholder="请选择开始时间" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="结束时间" name="workingFinish">
|
|
<uni-datetime-picker type="date" :clear-icon="false" v-model="form.workingFinish" placeholder="请选择结束时间"/>
|
|
</uni-forms-item>
|
|
</uni-forms>
|
|
<u-button @click="submit" type="primary" customStyle="background-color:#2b7; border:none;margin-top:20rpx" text="确定"></u-button>
|
|
</view>
|
|
</u-popup>
|
|
<!-- 提示组建 -->
|
|
<u-toast ref="uToast"></u-toast>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
//任务ID
|
|
taskId:null,
|
|
popupVisiable: false,
|
|
form: {},
|
|
//人工工时列表
|
|
costEmployeeList: [],
|
|
//雇员列表
|
|
employeeList: [],
|
|
queryParams: {
|
|
pageSize: null,
|
|
pageNum: null,
|
|
employeeId: null,
|
|
tastId:null
|
|
},
|
|
//表单校验规则
|
|
rules:{
|
|
workingHours:{rules:[{required: true,errorMessage: '请填写工时'},{format:'number',errorMessage:'工时必须为数字'}]},
|
|
employeeId:{rules:[{required: true,errorMessage: '请选择雇员'}]},
|
|
workingStart:{rules:[{required: true,errorMessage: '请选择开始时间'}]},
|
|
workingFinish:{rules:[{required: true,errorMessage: '请选择结束时间'}]}
|
|
},
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
this.taskId = option.taskId;
|
|
this.queryParams.taskId = this.taskId
|
|
this.getCostEmployeeList();
|
|
this.getEmployeeList();
|
|
},
|
|
async onPullDownRefresh() {
|
|
await this.getCostEmployeeList();
|
|
uni.stopPullDownRefresh();
|
|
},
|
|
computed: {
|
|
// 格式化 employeeList 的数据给下拉选择使用
|
|
fmtEmployeeList() {
|
|
return this.employeeList.map(item => ({
|
|
text: item.employeeName,
|
|
value: item.employeeId,
|
|
disable: false
|
|
}));
|
|
}
|
|
},
|
|
methods: {
|
|
//翻译人工工时中的雇员姓名
|
|
transformEmployeeName(val) {
|
|
let employeeName = ""
|
|
this.employeeList.forEach((item, index) => {
|
|
if (item.employeeId == val) {
|
|
employeeName = item.employeeName;
|
|
}
|
|
})
|
|
return employeeName;
|
|
},
|
|
//重置表单
|
|
reset(){
|
|
this.form={
|
|
costId:null,
|
|
taskId:this.taskId,
|
|
workingStart: null,
|
|
workingFinish: null,
|
|
workingHours: null,
|
|
employeeId: null
|
|
}
|
|
},
|
|
//获取人工工时列表
|
|
async getCostEmployeeList() {
|
|
const {
|
|
rows
|
|
} = await uni.$u.http.get('/agriculture/costEmployee/list', {
|
|
params: this.queryParams
|
|
});
|
|
this.costEmployeeList = rows;
|
|
},
|
|
//获取雇员列表
|
|
async getEmployeeList() {
|
|
const {
|
|
rows
|
|
} = await uni.$u.http.get('/agriculture/employee/list');
|
|
this.employeeList = rows;
|
|
console.log(11, this.employeeList)
|
|
},
|
|
//处理新增
|
|
handleAdd(){
|
|
this.popupVisiable=true;
|
|
this.reset();
|
|
},
|
|
//表单提交
|
|
submit(){
|
|
this.$refs.form.validate().then(res => {
|
|
if(this.form.costId == null){
|
|
uni.$u.http.post('/agriculture/costEmployee',this.form).then(res=>{
|
|
//提示
|
|
this.$refs.uToast.show({type: 'success',message: '新增成功'});
|
|
//关闭弹出层
|
|
this.popupVisiable=false;
|
|
//刷新列表
|
|
this.getCostEmployeeList();
|
|
})
|
|
}else{
|
|
uni.$u.http.put('/agriculture/costEmployee',this.form).then(res=>{
|
|
//提示
|
|
this.$refs.uToast.show({type: 'success',message: '修改成功'});
|
|
//关闭弹出层
|
|
this.popupVisiable=false;
|
|
//刷新列表
|
|
this.getCostEmployeeList();
|
|
})
|
|
}
|
|
})
|
|
},
|
|
//删除
|
|
del(costId){
|
|
uni.$u.http.delete('/agriculture/costEmployee/' + costId).then(res=>{
|
|
//提示
|
|
this.$refs.uToast.show({type: 'success',message: '删除成功'});
|
|
//刷新列表
|
|
this.getCostEmployeeList();
|
|
});
|
|
},
|
|
//查看
|
|
edit(costId){
|
|
uni.$u.http.get('/agriculture/costEmployee/' + costId).then(res=>{
|
|
this.form = res.data;
|
|
this.popupVisiable=true;
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.addBtn{
|
|
position: fixed;
|
|
right: 40rpx;
|
|
bottom: 160rpx;
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
border-radius: 50rpx;
|
|
background: #2b7;
|
|
color: #fff;
|
|
font-size: 80rpx;
|
|
text-align: center;
|
|
line-height: 90rpx;
|
|
}
|
|
</style> |