<template>
|
<view class="container">
|
<uni-section :title="isEdit ? '修改工时' : '录入工时'" type="line">
|
<view class="example">
|
<!-- 基础用法,不包含校验规则 -->
|
<uni-forms labelWidth="75px" ref="baseForm" :modelValue="baseFormData" :rules="rules">
|
<uni-forms-item label="项目名称" required name="projectCode">
|
<view class="project-select" @click="showProjectSelector">
|
<uni-easyinput
|
v-model="selectedProjectText"
|
placeholder="请选择项目"
|
readonly
|
/>
|
</view>
|
<project-selector
|
ref="projectSelector"
|
v-model="baseFormData.projectCode"
|
@change="handleProjectChange"
|
/>
|
</uni-forms-item>
|
<uni-forms-item label="项目阶段" required name="projectPhase">
|
<uni-data-select
|
v-model="baseFormData.projectPhase"
|
:localdata="phaseSelect"
|
@change="change"
|
></uni-data-select>
|
</uni-forms-item>
|
<uni-forms-item label="工种" required name="workType">
|
<uni-data-select
|
v-model="baseFormData.workType"
|
:localdata="typeSelect"
|
@change="change"
|
></uni-data-select>
|
</uni-forms-item>
|
<uni-forms-item label="工时" required name="workTime">
|
<uni-easyinput @input="validateWorkTime" v-model="baseFormData.workTime" placeholder="请输入工时" />
|
</uni-forms-item>
|
<uni-forms-item label="工作详情">
|
<uni-easyinput type="textarea" v-model="baseFormData.details" placeholder="请编辑工作详情" />
|
</uni-forms-item>
|
<button form-type="submit" type="primary" @click="handleSubmit('baseForm')">提交</button>
|
|
</uni-forms>
|
</view>
|
</uni-section>
|
</view>
|
</template>
|
<script>
|
import { getDicts } from '@/api/dema/dictData.js'
|
import { appAddWorkHourInfo, appUpdateWorkHourInfo } from '@/api/dema/workHourInfo.js'
|
import ProjectSelector from '@/components/ProjectSelector/index.vue'
|
export default {
|
components: {
|
ProjectSelector
|
},
|
data() {
|
return {
|
// 基础表单数据
|
baseFormData: {
|
projectCode: '',
|
projectName: '',
|
projectPhase: '',
|
workType: '',
|
workTime: '',
|
details: '',
|
workHourId: '',
|
},
|
selectedProjectText: '',
|
typeSelect: [
|
// { value: '机械设计', text: "机械设计" },
|
// { value: '电气设计', text: "电气设计" },
|
// { value: '软件', text: "软件" },
|
// { value: '软件', text: "视觉" },
|
// { value: '电气调试', text: "电气调试" },
|
// { value: '电工', text: "电工" },
|
// { value: '钳工', text: "钳工" },
|
// { value: '现场经理', text: "现场经理" },
|
],
|
phaseSelect: [
|
// { value: '场内设计', text: "场内设计" },
|
// { value: '场内装配', text: "场内装配" },
|
// { value: '场内调试', text: "场内调试" },
|
// { value: '场外装配', text: "场外装配" },
|
// { value: '场外调试', text: "场外调试" },
|
// { value: '试生产', text: "试生产" },
|
// { value: '陪产', text: "陪产" },
|
// { value: '终验收', text: "终验收" },
|
],
|
codeSelect: [
|
{ value: '042湖州智芯', text: "042湖州智芯" },
|
{ value: '040春风动力', text: "040春风动力" },
|
],
|
rules: {
|
projectCode: {
|
rules: [{
|
required: true,
|
errorMessage: '请选择项目'
|
}]
|
},
|
projectPhase: {
|
rules: [{
|
required: true,
|
errorMessage: '请选择项目阶段'
|
}]
|
},
|
workType: {
|
rules: [{
|
required: true,
|
errorMessage: '请选择工种'
|
}]
|
},
|
workTime: {
|
rules: [{
|
required: true,
|
errorMessage: '请输入工时'
|
}, {
|
format: 'number',
|
errorMessage: '工时必须是数字'
|
}, {
|
validateFunction: (rule, value, data, callback) => {
|
if (value > 24) {
|
callback('工时不能大于24小时');
|
}
|
return true;
|
}
|
}]
|
},
|
},
|
isEdit: false, // 是否是编辑模式
|
recordId: '', // 记录ID
|
}
|
},
|
onLoad(options) {
|
// 处理传入的参数
|
if (options.isEdit === 'true') {
|
this.isEdit = true;
|
this.recordId = options.id;
|
|
// 获取工种和项目阶段的文本显示
|
// const workTypeText = this.typeSelect.find(item => item.value === Number(options.workType))?.text || '';
|
// const phaseText = this.phaseSelect.find(item => item.value === Number(options.projectPhase))?.text || '';
|
|
// 填充表单数据
|
this.baseFormData = {
|
workHourId: options.workHourId,
|
projectCode: options.projectCode,
|
projectName: options.projectName,
|
projectPhase: options.projectPhase, // 确保转换为数字
|
workType: options.workType, // 确保转换为数字
|
workTime: options.workTime,
|
details: options.details || ''
|
};
|
|
// 设置项目选择器的显示文本
|
this.selectedProjectText = options.projectName;
|
|
// 打印调试信息
|
console.log('工种:', workTypeText, '项目阶段:', phaseText);
|
console.log('表单数据:', this.baseFormData);
|
}
|
},
|
created() {
|
this.initGetDicts()
|
},
|
methods: {
|
initGetDicts(value){
|
getDicts("work_type").then(response => {
|
this.typeSelect = response.data.map(item => ({
|
value: item.dictValue,
|
text: item.dictValue
|
}));
|
});
|
getDicts("project_phase").then(response => {
|
this.phaseSelect = response.data.map(item => ({
|
value: item.dictValue,
|
text: item.dictValue
|
}));
|
});
|
},
|
validateWorkTime(value) {
|
// // 移除非数字字符
|
// this.baseFormData.workTime = value.replace(/[^\d.]/g, '');
|
// // 限制最大值为24
|
// if (Number(this.baseFormData.workTime) > 24) {
|
// this.baseFormData.workTime = '24';
|
// }
|
// 只允许数字和小数点,且小数点只能出现一次
|
let newValue = value.replace(/[^\d.]/g, '');
|
// 确保只有一个小数点
|
if (newValue.split('.').length > 2) {
|
newValue = newValue.replace(/\.+/g, '.');
|
}
|
// 限制最大值为24
|
if (Number(newValue) > 24) {
|
newValue = '24';
|
}
|
// 更新表单数据
|
this.baseFormData.workTime = newValue;
|
},
|
change(){
|
},
|
handleBack() {
|
uni.navigateBack({
|
delta: 1
|
});
|
},
|
handleReset() {
|
this.$refs.baseForm.resetFields();
|
},
|
handleSubmit(ref) {
|
this.$refs.baseForm.validate().then(valid => {
|
if (valid) {
|
if(this.baseFormData.workTime > 8 && this.baseFormData.details === ''){
|
this.$modal.msgError("工时超过8小时时,必须填写工作详情");
|
return false
|
}
|
const submitData = {
|
...this.baseFormData,
|
// workTime: Number(this.baseFormData.workTime) // 旧代码
|
workTime: parseFloat(this.baseFormData.workTime) // 修改为 parseFloat 以保留小数
|
};
|
|
// 如果是编辑模式,添加ID
|
if (this.isEdit) {
|
submitData.id = this.recordId;
|
}
|
|
// 根据模式选择API
|
const api = this.isEdit ? appUpdateWorkHourInfo : appAddWorkHourInfo;
|
const successMsg = this.isEdit ? '修改成功' : '新增成功';
|
|
api(submitData).then(response => {
|
this.$modal.msgSuccess(successMsg);
|
setTimeout(() => {
|
if(successMsg === '新增成功'){
|
this.$tab.navigateBack();
|
}else{
|
// 返回上一页并刷新列表
|
const pages = getCurrentPages();
|
const prevPage = pages[pages.length - 2];
|
if (prevPage && prevPage.$vm) {
|
// 调用上一页的刷新方法
|
prevPage.$vm.getList();
|
this.$tab.navigateBack();
|
}
|
}
|
|
}, 700);
|
}).catch(error => {
|
this.$modal.msgError(this.isEdit ? "修改失败" : "提交失败:" + error.message);
|
});
|
}
|
}).catch(errors => {
|
console.log('表单验证失败:', errors);
|
let errorMsg = '';
|
if (Array.isArray(errors)) {
|
errorMsg = errors.map(error => error.errorMessage).join('\n');
|
} else {
|
errorMsg = '请填写必填项';
|
}
|
this.$modal.msgError(errorMsg);
|
});
|
|
},
|
|
showProjectSelector() {
|
this.$refs.projectSelector.show()
|
},
|
handleProjectChange(project) {
|
this.selectedProjectText = project.text
|
this.baseFormData.projectCode = project.value
|
this.baseFormData.projectName = project.text;
|
}
|
}
|
}
|
</script>
|
|
<style>
|
.uni-form-item .title {
|
padding: 20rpx 0;
|
}
|
.example {
|
padding: 15px;
|
background-color: #fff;
|
}
|
|
.segmented-control {
|
margin-bottom: 15px;
|
}
|
|
.button-group {
|
margin-top: 15px;
|
display: flex;
|
justify-content: space-around;
|
}
|
|
.form-item {
|
display: flex;
|
align-items: center;
|
}
|
|
.button {
|
display: flex;
|
align-items: center;
|
height: 35px;
|
margin-left: 10px;
|
}
|
.title {
|
font-size: 14px;
|
font-weight: bold;
|
margin: 20px 0 5px 0;
|
}
|
|
.data-pickerview {
|
height: 400px;
|
border: 1px #e5e5e5 solid;
|
}
|
|
.popper__arrow {
|
top: -6px;
|
left: 50%;
|
margin-right: 3px;
|
border-top-width: 0;
|
border-bottom-color: #EBEEF5;
|
}
|
.popper__arrow {
|
top: -6px;
|
left: 50%;
|
margin-right: 3px;
|
border-top-width: 0;
|
border-bottom-color: #EBEEF5;
|
}
|
.project-select {
|
position: relative;
|
width: 100%;
|
}
|
|
.project-select :deep(.uni-easyinput__content) {
|
cursor: pointer;
|
background-color: #f5f5f5;
|
}
|
</style>
|