-

admin

6 天以前 9ee8fbbecf45f58fd2469d9049b7938e363d9a4f

 pages/dema/workHour/workHour.vue

@@ -1,71 +1,204 @@
<template>
   <view class="container">
      <uni-section title="表单详情" type="line">
      <uni-section :title="isEdit ? '修改工时' : '录入工时'" type="line">
         <view class="example">
            <!-- 基础用法，不包含校验规则 -->
            <uni-forms labelWidth="75px" ref="baseForm" :modelValue="baseFormData">
               <uni-forms-item label="项目编码" required>
                  <uni-data-select
                    v-model="baseFormData.projectCode"
                    :localdata="codeSelect"
                    @change="change"
                  ></uni-data-select>
            <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>
               <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>
               <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>
                  <uni-easyinput v-model="baseFormData.workTime" placeholder="请输入工时" />
               <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>
            <button form-type="submit" type="primary" @click="handleSubmit">提交</button>
         </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: 0,
               projectPhase: 0,
               workType: 0,
               projectCode: '',
               projectName: '',
               projectPhase: '',
               workType: '',
               workTime: '',
               details: '',
               workHourId: '',
            },
            selectedProjectText: '',
            typeSelect: [
              { value: 0, text: "机械设计" },
              { value: 1, text: "PLC" },
              { value: 2, text: "MES" },
              // { value: '机械设计', text: "机械设计" },
              // { value: '电气设计', text: "电气设计" },
              // { value: '软件', text: "软件" },
              // { value: '软件', text: "视觉" },
              // { value: '电气调试', text: "电气调试" },
              // { value: '电工', text: "电工" },
              // { value: '钳工', text: "钳工" },
              // { value: '现场经理', text: "现场经理" },
            ],
            phaseSelect: [
              { value: 0, text: "场内设计" },
              { value: 1, text: "技术支持" },
              // { value: '场内设计', text: "场内设计" },
              // { value: '场内装配', text: "场内装配" },
              // { value: '场内调试', text: "场内调试" },
              // { value: '场外装配', text: "场外装配" },
              // { value: '场外调试', text: "场外调试" },
              // { value: '试生产', text: "试生产" },
              // { value: '陪产', text: "陪产" },
              // { value: '终验收', text: "终验收" },
            ],
            codeSelect: [
              { value: 0, text: "042湖州智芯" },
              { value: 1, text: "040春风动力" },
              { 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
@@ -74,16 +207,70 @@
         handleReset() {
            this.$refs.baseForm.resetFields();
         },
         handleSubmit() {
            this.$modal.msg("默认反馈"+JSON.stringify(this.baseFormData));
            // this.$refs.baseForm.validate().then(res => {
            //    console.log('表单数据:', res);
            //    // 在这里处理表单数据
            // }).catch(err => {
            //    console.log('表单验证失败:', err);
            // });
            this.$tab.navigateBack();
         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>
@@ -118,4 +305,39 @@
         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>