oa 中除了工作办理没有测试其他测试完成

wuxw
1 parent eb48bd86
Showing 18 changed files with 451 additions and 300 deletions
src/components/oa/addWorkType.vue
src/components/oa/editWorkType.vue
src/components/oa/newOaWorkflowFinish.vue
src/components/oa/newOaWorkflowForm.vue
src/components/oa/newOaWorkflowUndo.vue
src/i18n/commonLang.js
src/router/index.js
src/views/oa/addAttendanceClassesStaffList.vue
src/views/oa/addWorkList.vue
src/views/oa/newOaWorkflowDetailList.vue
src/views/oa/newOaWorkflowDoingList.vue
src/views/oa/newOaWorkflowFormEditList.vue
src/views/oa/newOaWorkflowList.vue
src/views/oa/startWorkList.vue
src/views/oa/workTypeList.vue
src/views/org/orgList.vue
src/views/resource/addItemOutList.vue
src/views/staff/staffList.vue
 <template>
-  <el-dialog
-    :title="$t('workType.add.title')"
-    :visible.sync="visible"
-    width="50%"
-    @close="handleClose"
-  >
-    <el-form ref="form" :model="formData" :rules="rules" label-width="120px">
+  <el-dialog :title="$t('workType.add.title')" :visible.sync="visible" width="50%" @close="handleClose">
+    <el-form ref="form" :model="formData" :rules="rules" label-width="120px" class="text-left">
       <el-form-item :label="$t('workType.form.typeName')" prop="typeName">
-        <el-input
-          v-model.trim="formData.typeName"
-          :placeholder="$t('workType.placeholder.typeName')"
-        />
+        <el-input v-model.trim="formData.typeName" :placeholder="$t('workType.placeholder.typeName')" />
       </el-form-item>
-      
+
       <el-form-item :label="$t('workType.form.deduction')" prop="deduction">
-        <el-select
-          v-model="formData.deduction"
-          :placeholder="$t('workType.placeholder.deduction')"
-          style="width:100%"
-        >
-          <el-option
-            v-for="item in deductionOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+        <el-select v-model="formData.deduction" :placeholder="$t('workType.placeholder.deduction')" style="width:100%">
+          <el-option v-for="item in deductionOptions" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
         <div class="el-form-item__tip" v-if="formData.deduction === 'Y'">
           {{ $t('workType.tip.deduction') }}
@@ -32,17 +15,8 @@
       </el-form-item>
       <el-form-item :label="$t('workType.form.smsWay')" prop="smsWay">
-        <el-select
-          v-model="formData.smsWay"
-          :placeholder="$t('workType.placeholder.smsWay')"
-          style="width:100%"
-        >
-          <el-option
-            v-for="item in smsWayOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+        <el-select v-model="formData.smsWay" :placeholder="$t('workType.placeholder.smsWay')" style="width:100%">
+          <el-option v-for="item in smsWayOptions" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
         <div class="el-form-item__tip" v-if="formData.smsWay === 'WECHAT'">
           {{ $t('workType.tip.wechat') }}
@@ -53,14 +27,8 @@
       </el-form-item>
       <el-form-item :label="$t('workType.form.remark')">
-        <el-input
-          v-model.trim="formData.remark"
-          type="textarea"
-          :rows="3"
-          :placeholder="$t('workType.placeholder.remark')"
-          maxlength="500"
-          show-word-limit
-        />
+        <el-input v-model.trim="formData.remark" type="textarea" :rows="3"
+          :placeholder="$t('workType.placeholder.remark')" maxlength="500" show-word-limit />
       </el-form-item>
     </el-form>
 <template>
-  <el-dialog
-    :title="$t('workType.edit.title')"
-    :visible.sync="visible"
-    width="50%"
-    @close="handleClose"
-  >
-    <el-form ref="form" :model="formData" :rules="rules" label-width="120px">
+  <el-dialog :title="$t('workType.edit.title')" :visible.sync="visible" width="50%" @close="handleClose">
+    <el-form ref="form" :model="formData" :rules="rules" label-width="120px" class="text-left">
       <el-form-item :label="$t('workType.form.typeName')" prop="typeName">
-        <el-input
-          v-model.trim="formData.typeName"
-          :placeholder="$t('workType.placeholder.typeName')"
-        />
+        <el-input v-model.trim="formData.typeName" :placeholder="$t('workType.placeholder.typeName')" />
       </el-form-item>
-      
+
       <el-form-item :label="$t('workType.form.deduction')" prop="deduction">
-        <el-select
-          v-model="formData.deduction"
-          :placeholder="$t('workType.placeholder.deduction')"
-          style="width:100%"
-        >
-          <el-option
-            v-for="item in deductionOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+        <el-select v-model="formData.deduction" :placeholder="$t('workType.placeholder.deduction')" style="width:100%">
+          <el-option v-for="item in deductionOptions" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
         <div class="el-form-item__tip" v-if="formData.deduction === 'Y'">
           {{ $t('workType.tip.deduction') }}
@@ -32,29 +15,14 @@
       </el-form-item>
       <el-form-item :label="$t('workType.form.smsWay')" prop="smsWay">
-        <el-select
-          v-model="formData.smsWay"
-          :placeholder="$t('workType.placeholder.smsWay')"
-          style="width:100%"
-        >
-          <el-option
-            v-for="item in smsWayOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+        <el-select v-model="formData.smsWay" :placeholder="$t('workType.placeholder.smsWay')" style="width:100%">
+          <el-option v-for="item in smsWayOptions" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
       </el-form-item>
       <el-form-item :label="$t('workType.form.remark')">
-        <el-input
-          v-model.trim="formData.remark"
-          type="textarea"
-          :rows="3"
-          :placeholder="$t('workType.placeholder.remark')"
-          maxlength="500"
-          show-word-limit
-        />
+        <el-input v-model.trim="formData.remark" type="textarea" :rows="3"
+          :placeholder="$t('workType.placeholder.remark')" maxlength="500" show-word-limit />
       </el-form-item>
     </el-form>
@@ -4,7 +4,7 @@
       <div slot="header" class="flex justify-between">
         <span>{{ $t('newOaWorkflowFinish.searchTitle') }}</span>
       </div>
-      <el-form :inline="true" :model="conditions" class="search-form">
+      <el-form :inline="true" :model="conditions" class="search-form text-left">
         <el-form-item>
           <el-input v-model="conditions.createUserName" :placeholder="$t('newOaWorkflowFinish.enterApplicant')"
             clearable />
 <template>
   <div class="new-oa-workflow-form">
     <el-card class="form-card">
-      <div class="form-container" id="form-container">
+      <el-form ref="form" :model="formData" label-width="120px" label-position="right" class="text-left">
+        <div v-for="(item, index) in components" :key="index">
+          <!-- 标题 -->
+          <el-divider v-if="item.type == 'text'" content-position="left">
+            <span class="form-title">{{ item.text }}</span>
+          </el-divider>
-        <div class="upload-wrapper">
-          <upload-file ref="uploadFile" :call-back-listener="callBackListener" :call-back-function="callBackFunction" />
+          <!-- 文本框 -->
+          <el-form-item v-if="item.type == 'textfield'" :label="item.label" :prop="item.key"
+            :rules="getValidationRules(item)">
+            <el-input v-model="item.value" :placeholder="item.description" clearable>
+            </el-input>
+          </el-form-item>
+
+          <!-- 数字框 -->
+          <el-form-item v-if="item.type == 'number'" :label="item.label" :prop="item.key"
+            :rules="getValidationRules(item)">
+            <el-input-number v-model="item.value" :placeholder="item.description" :min="0" style="width: 100%">
+            </el-input-number>
+          </el-form-item>
+
+          <!-- 文本域 -->
+          <el-form-item v-if="item.type == 'textarea'" :label="item.label" :prop="item.key"
+            :rules="getValidationRules(item)">
+            <el-input v-model="item.value" type="textarea" :rows="4" :placeholder="item.description">
+            </el-input>
+          </el-form-item>
+
+          <!-- 日期选择 -->
+          <el-form-item v-if="item.type == 'textdate'" :label="item.label" :prop="item.key"
+            :rules="getValidationRules(item)">
+            <el-date-picker v-model="item.value" type="date" :placeholder="item.description" format="yyyy-MM-dd"
+              value-format="yyyy-MM-dd" style="width: 100%">
+            </el-date-picker>
+          </el-form-item>
+
+          <!-- 时间选择 -->
+          <el-form-item v-if="item.type == 'textdatetime'" :label="item.label" :prop="item.key"
+            :rules="getValidationRules(item)">
+            <el-time-picker v-model="item.value" :placeholder="item.description" format="HH:mm"
+              value-format="HH:mm" style="width: 100%">
+            </el-time-picker>
+          </el-form-item>
+
+          <!-- 单选框 -->
+          <el-form-item v-if="item.type == 'radio'" :label="item.label" :prop="item.key"
+            :rules="getValidationRules(item)">
+            <el-radio-group v-model="item.value">
+              <el-radio v-for="(option, optionIndex) in item.values" :key="optionIndex" :label="option.value">
+                {{ option.label }}
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+
+          <!-- 下拉选择 -->
+          <el-form-item v-if="item.type == 'select'" :label="item.label" :prop="item.key"
+            :rules="getValidationRules(item)">
+            <el-select v-model="item.value" :placeholder="item.description" style="width: 100%" clearable>
+              <el-option v-for="(option, optionIndex) in item.values" :key="optionIndex" :label="option.label"
+                :value="option.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+
+          <!-- 复选框 -->
+          <el-form-item v-if="item.type == 'checkbox'" :label="item.label" :prop="item.key"
+            :rules="getValidationRules(item)">
+            <el-checkbox-group v-model="item.value">
+              <el-checkbox v-for="(option, optionIndex) in item.values" :key="optionIndex" :label="option.value">
+                {{ option.label }}
+              </el-checkbox>
+            </el-checkbox-group>
+          </el-form-item>
+
+          <!-- 文件上传 -->
+          <el-form-item v-if="item.type == 'button' && item.action == 'submit'" :label="$t('common.file')">
+            <div class="upload-section">
+              <upload-file ref="uploadFile" @notify="handleFileUpload" />
+            </div>
+          </el-form-item>
+
+          <!-- 提交按钮 -->
+          <el-form-item v-if="item.type == 'button' && item.action == 'submit'" class="text-right">
+            <el-button type="primary" @click="_doSubmit" :loading="submitLoading">
+              <i class="el-icon-check"></i>
+              {{ item.label }}
+            </el-button>
+          </el-form-item>
+
+          <!-- 重置按钮 -->
+          <el-form-item v-if="item.type == 'button' && item.action == 'reset'"  class="text-right">
+            <el-button @click="_doReset">
+              <i class="el-icon-refresh"></i>
+              {{ item.label }}
+            </el-button>
+          </el-form-item>
         </div>
-      </div>
+      </el-form>
     </el-card>
   </div>
 </template>
@@ -15,7 +107,6 @@
 <script>
 import UploadFile from '@/components/upload/uploadFile'
 import { queryOaWorkflowForm, saveOaWorkflowFormData } from '@/api/oa/newOaWorkflowApi'
-//import { Formio } from 'formiojs'
 export default {
   name: 'NewOaWorkflowForm',
@@ -24,20 +115,26 @@ export default {
   data() {
     return {
       formJson: {},
+      components: [],
+      formData: {},
       fileName: '',
       realFileName: '',
       callBackListener: 'newOaWorkflowForm',
       callBackFunction: 'fileName',
-      formViewer: null
+      submitLoading: false,
+      showUploadComponent: false
     }
   },
+
   mounted() {
   },
+
   methods: {
     open(params) {
       this.flowId = params.flowId
       this.listOaWorkflowForm()
     },
+
     async listOaWorkflowForm() {
       try {
         const res = await queryOaWorkflowForm({
@@ -50,60 +147,109 @@ export default {
         this.initForm()
       } catch (error) {
         console.error('获取表单配置失败:', error)
+        this.$message.error('获取表单配置失败')
       }
     },
+
     initForm() {
-      const container = document.getElementById('form-container')
+      this.components = this.formJson.components
+      this.formData = {}
-      const form = window.FormViewer.createForm({
-        container,
-        schema: this.formJson
-      });
-      console.log(form);
-      form.then((_from) => {
-        _from.on('submit', (event) => {
-          this.submitFormData(event.data, event.errors);
-        })
-      }).then((_from) => {
-        console.log(_from);
-        let node = document.querySelector('.fjs-form .uploadFile');
-        const submitBtn = document.querySelector('.fjs-form .fjs-form-field-button');
-        submitBtn.parentNode.insertBefore(node, submitBtn);
-      });
+      this.components.forEach(item => {
+        if (item.type !== 'button' && item.type !== 'text') {
+          // 初始化表单数据
+          if (item.type === 'checkbox') {
+            this.formData[item.key] = []
+          } else if (item.type === 'radio' || item.type === 'select') {
+            this.formData[item.key] = item.values && item.values.length > 0 ? item.values[0].value : ''
+          } else {
+            this.formData[item.key] = ''
+          }
+        }
+      })
     },
-    async submitFormData(data, errors) {
-      if (Object.keys(errors).length !== 0) return
-
-      const formData = {
-        ...data,
-        flowId: this.flowId,
-        fileName: this.fileName,
-        realFileName: this.realFileName
+
+    getValidationRules(item) {
+      const rules = []
+      if (item.validate && item.validate.required) {
+        rules.push({
+          required: true,
+          message: `${item.label}不能为空`,
+          trigger: 'blur'
+        })
       }
+      return rules
+    },
+    async _doSubmit() {
       try {
-        const res = await saveOaWorkflowFormData(formData)
+        // 表单验证
+        await this.$refs.form.validate()
+
+        this.submitLoading = true
+
+        const _data = {
+          fileName: this.fileName,
+          realFileName: this.realFileName,
+          flowId: this.flowId,
+          ...this.formData
+        }
+
+        const res = await saveOaWorkflowFormData(_data)
         if (res.code === 0) {
           this.$message.success(this.$t('common.submitSuccess'))
           this.resetForm()
           this.$emit('switch-tab', 'newOaWorkflowPool')
         } else {
-          this.$message.error(res.msg)
+          this.$message.error(res.msg || this.$t('common.submitFailed'))
         }
       } catch (error) {
+        if (error.message) {
+          // 表单验证错误
+          return
+        }
         console.error('提交表单失败:', error)
         this.$message.error(this.$t('common.submitFailed'))
+      } finally {
+        this.submitLoading = false
       }
     },
+
+    _doReset() {
+      let _that = this;
+      _that.components.forEach(item => {
+        item.value = "";
+        if (item.type == 'textdate' || item.type == 'textdatetime') {
+          item.value = "请选择";
+        }
+
+        if (item.type == "radio" || item.type == "select") {
+          item.valueIndex = 0;
+        }
+      });
+      this.$forceUpdate();
+    },
+
+    _doUploadFile() {
+      this.showUploadComponent = true
+      this.$nextTick(() => {
+        this.$refs.uploadFile.open()
+      })
+    },
+
     resetForm() {
-      if (this.formViewer) {
-        this.formViewer.destroy()
+      this.$refs.form.resetFields()
+      if (this.$refs.uploadFile) {
+        this.$refs.uploadFile.clear()
       }
-      this.$refs.uploadFile.clear()
       this.fileName = ''
       this.realFileName = ''
       this.formJson = {}
+      this.components = []
+      this.formData = {}
+      this.showUploadComponent = false
     },
+
     handleFileUpload(fileInfo) {
       this.fileName = fileInfo.fileName
       this.realFileName = fileInfo.realFileName
@@ -112,103 +258,28 @@ export default {
 }
 </script>
-<style lang="scss">
+<style lang="scss" scoped>
 .new-oa-workflow-form {
   .form-card {
-    padding: 20px;
-    border-radius: 4px;
-    border: 1px solid #ebeef5;
-    background-color: #fff;
-    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-
-    .form-container {
-
-      .upload-wrapper {
-        margin-bottom: 20px;
-        padding: 20px;
-        background-color: #fafafa;
-        border: 1px solid #e4e7ed;
-        border-radius: 4px;
-      }
+    .form-title {
+      font-size: 16px;
+      font-weight: 600;
+      color: #303133;
     }
-  }
-}
-
-// 全局Formio样式覆盖（不使用scoped）
-
-// Formio Element UI 风格样式
-.formio-form {
-  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif !important;
-
-  .form-group {
-    margin-bottom: 22px !important;
-    text-align: left !important;
-  }
-
-  .form-control {
-    border: 1px solid #dcdfe6 !important;
-    border-radius: 4px !important;
-    padding: 0 15px !important;
-    height: 40px !important;
-    line-height: 40px !important;
-    font-size: 14px !important;
-    background: #fff !important;
-    color: #606266 !important;
-    box-sizing: border-box !important;
-    width: 100% !important;
-    transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
-  }
-
-  .form-control:focus {
-    border-color: #409eff !important;
-    outline: none !important;
-  }
-
-  .form-control:disabled {
-    background: #f5f7fa !important;
-    color: #c0c4cc !important;
-  }
-
-  .col-form-label {
-    font-weight: 500 !important;
-    color: #606266 !important;
-    font-size: 14px !important;
-    margin-bottom: 8px !important;
-  }
-
-  .formio-errors {
-    color: #f56c6c !important;
-    font-size: 12px !important;
-    margin-top: 4px !important;
-  }
-  button.btn {
-    background-color: #409eff !important;
-    border: 1px solid #409eff !important;
-    border-radius: 4px !important;
-    padding: 12px 20px !important;
-    font-size: 14px !important;
-    font-weight: 500 !important;
-    color: #fff !important;
-    cursor: pointer !important;
-    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
-  }
-
-  button.btn:hover {
-    background-color: #66b1ff !important;
-    border-color: #66b1ff !important;
-  }
+    .upload-section {
+      .file-info {
+        margin-bottom: 10px;
+      }
+    }
-  button.btn:active {
-    background-color: #3a8ee6 !important;
-    border-color: #3a8ee6 !important;
-  }
+    .el-form-item {
+      margin-bottom: 22px;
+    }
-  button.btn:disabled {
-    background-color: #c0c4cc !important;
-    border-color: #c0c4cc !important;
-    color: #fff !important;
-    cursor: not-allowed !important;
+    .el-divider {
+      margin: 24px 0;
+    }
   }
 }
 </style>
 \ No newline at end of file
@@ -4,7 +4,7 @@
       <div slot="header" class="flex justify-between">
         <span>{{ $t('newOaWorkflowUndo.searchTitle') }}</span>
       </div>
-      <el-form :inline="true" :model="conditions" class="search-form">
+      <el-form :inline="true" :model="conditions" class="search-form text-left">
         <el-form-item>
           <el-input v-model="conditions.createUserName" :placeholder="$t('newOaWorkflowUndo.enterApplicant')"
             clearable />
@@ -58,6 +58,7 @@ export const messages = {
         submitSuccess:'Submit successfully',
         saveSuccess:'successfully',
         noData:'No Data',
+        file:'File'
       }
     },
     zh: {
@@ -119,6 +120,7 @@ export const messages = {
         submitSuccess:'提交成功',
         saveSuccess:'成功',
         noData:'暂无数据',
+        file:'附件'
       }
     }
   } 
 \ No newline at end of file
@@ -63,8 +63,8 @@ const routes = [
       {
-        path: '/views/staff/staffDetailList',
-        name: '/views/staff/staffDetailList',
+        path: '/views/staff/staffDetail',
+        name: '/views/staff/staffDetail',
         component: () => import('@/views/staff/staffDetailList.vue')
       },
 <template>
   <div class="add-attendance-classes-staff-container">
     <el-card>
-      <div slot="header" class="clearfix">
+      <div slot="header" class="flex justify-between">
         <span>{{ $t('addAttendanceClassesStaff.title') }}</span>
         <el-button type="primary" size="small" class="float-right" @click="handleGoBack">
           <i class="el-icon-close"></i>
 <template>
   <div class="add-work-container">
     <el-card class="box-card">
-      <div slot="header" class="clearfix">
+      <div slot="header" class="flex justify-between">
         <span>{{ $t('addWork.title') }}</span>
       </div>
-      <el-form ref="form" :model="addWorkInfo" label-width="120px" label-position="right">
+      <el-form ref="form" :model="addWorkInfo" label-width="120px" label-position="right" class="text-left">
         <el-row :gutter="20">
           <el-col :span="12">
             <el-form-item :label="$t('addWork.workName')" prop="workName">
@@ -235,10 +235,10 @@ export default {
   methods: {
     initDateTime() {
       const now = new Date()
-      this.addWorkInfo.startTime = dateFormat(now)
+      this.addWorkInfo.startTime = dateFormat(now)+' 00:00:00'
       const tomorrow = new Date(now)
       tomorrow.setDate(tomorrow.getDate() + 1)
-      this.addWorkInfo.endTime = dateFormat(tomorrow)
+      this.addWorkInfo.endTime = dateFormat(tomorrow)+' 23:59:59'
     },
     addWorkValidate() {
       return this.$refs.form.validate()
@@ -93,7 +93,7 @@
             <span>{{ $t('newOaWorkflowDetail.workflowHandle') }}</span>
           </div>
-          <el-form label-width="120px">
+          <el-form label-width="120px" class="text-left">
             <el-form-item :label="$t('newOaWorkflowDetail.action')">
               <el-select v-model="newOaWorkflowDetailInfo.audit.auditCode" style="width:100%"
                 :placeholder="$t('newOaWorkflowDetail.selectAction')">
@@ -109,7 +109,7 @@
               </el-select>
             </el-form-item>
-            <el-form-item :label="$t('newOaWorkflowDetail.workflowDescription')">
+            <el-form-item :label="$t('newOaWorkflowDetail.workflowDescription')" class="margin-top">
               <el-input type="textarea" :rows="3" :placeholder="$t('newOaWorkflowDetail.descriptionRequired')"
                 v-model="newOaWorkflowDetailInfo.audit.auditMessage" />
             </el-form-item>
@@ -117,7 +117,7 @@
             <!-- 办理时 判断是否指定 委托人 如果指定了 则不显示 -->
             <el-form-item
               v-if="newOaWorkflowDetailInfo.audit.auditCode == '1100' && newOaWorkflowDetailInfo.nextAudit.assignee == '-2'"
-              :label="$t('newOaWorkflowDetail.nextHandler')">
+              :label="$t('newOaWorkflowDetail.nextHandler')" class="margin-top">
               <el-input v-model="newOaWorkflowDetailInfo.audit.staffName"
                 :placeholder="$t('newOaWorkflowDetail.selectNextHandler')" disabled style="width:80%" />
               <el-button type="primary" @click="chooseStaff" style="margin-left:10px">
@@ -127,7 +127,7 @@
             <!-- 转单时 必须指定 委托人 -->
             <el-form-item v-if="newOaWorkflowDetailInfo.audit.auditCode == '1300'"
-              :label="$t('newOaWorkflowDetail.nextHandler')">
+              :label="$t('newOaWorkflowDetail.nextHandler')" class="margin-top">
               <el-input v-model="newOaWorkflowDetailInfo.audit.staffName"
                 :placeholder="$t('newOaWorkflowDetail.selectNextHandler')" disabled style="width:80%" />
               <el-button type="primary" @click="chooseStaff" style="margin-left:10px">
@@ -158,13 +158,14 @@
       </el-col>
     </el-row>
-    <select-staff ref="selectStaff" />
+    <select-staff ref="selectStaff" @selectStaff="handleSelectStaff"/>
   </div>
 </template>
 <script>
 import { getCommunityId } from '@/api/community/communityApi'
-import { queryOaWorkflowForm, queryOaWorkflowFormData, queryOaWorkflowUser, getNextTask, auditOaWorkflow, listRunWorkflowImage } from '@/api/oa/newOaWorkflowDetailApi'
+import { queryOaWorkflowForm, queryOaWorkflowFormData, queryOaWorkflowUser, 
+  getNextTask, auditOaWorkflow, listRunWorkflowImage } from '@/api/oa/newOaWorkflowDetailApi'
 import SelectStaff from '@/components/staff/SelectStaff'
 export default {
@@ -253,7 +254,7 @@ export default {
           row: 10
         }
         const response = await queryOaWorkflowUser(params)
-        if (response.code !== '0') return
+        if (response.code !== 0) return
         this.newOaWorkflowDetailInfo.comments = response.data
       } catch (error) {
         console.error('请求失败:', error)
@@ -265,6 +266,10 @@ export default {
     chooseStaff() {
       this.$refs.selectStaff.open(this.newOaWorkflowDetailInfo.audit)
     },
+    handleSelectStaff(staff) {
+      this.newOaWorkflowDetailInfo.audit.staffId = staff.userId
+      this.newOaWorkflowDetailInfo.audit.staffName = staff.userName
+    },
     async _auditSubmit() {
       const audit = this.newOaWorkflowDetailInfo.audit
       audit.flowId = this.newOaWorkflowDetailInfo.flowId
@@ -336,7 +341,7 @@ export default {
           businessKey: this.newOaWorkflowDetailInfo.id
         }
         const response = await listRunWorkflowImage(params)
-        if (response.code !== '0') return
+        if (response.code !== 0) return
         this.newOaWorkflowDetailInfo.imgData = 'data:image/png;base64,' + response.data
       } catch (error) {
         console.error('请求失败:', error)
@@ -83,26 +83,26 @@ export default {
         ownerSettledApplyCount: 0
       },
       pendingItems: [
-        { key: 'repairPending', url: '/#/pages/property/repairDispatchManage', count: 0 },
-        { key: 'complaintPending', url: '/#/pages/complaint/uodoComplaints', count: 0 },
-        { key: 'purchasePending', url: '/#/pages/admin/myAuditOrders', count: 0 },
-        { key: 'collectionPending', url: '/#/pages/admin/myItemOutAuditOrders', count: 0 },
-        { key: 'contractApplyPending', url: '/#/pages/admin/contractApplyAuditOrders', count: 0 },
-        { key: 'contractChangePending', url: '/#/pages/admin/contractChangeAuditOrders', count: 0 },
-        { key: 'allocationPending', url: '/#/pages/admin/allocationStorehouseAuditOrders', count: 0 },
-        { key: 'itemReleasePending', url: '/#/pages/property/itemReleaseUndo', count: 0 },
-        { key: 'visitPending', url: '/#/pages/property/visitUndo', count: 0 }
+        { key: 'repairPending', url: '/pages/property/repairDispatchManage', count: 0 },
+        { key: 'complaintPending', url: '/pages/complaint/uodoComplaints', count: 0 },
+        { key: 'purchasePending', url: '/pages/admin/myAuditOrders', count: 0 },
+        { key: 'collectionPending', url: '/pages/admin/myItemOutAuditOrders', count: 0 },
+        { key: 'contractApplyPending', url: '/pages/admin/contractApplyAuditOrders', count: 0 },
+        { key: 'contractChangePending', url: '/pages/admin/contractChangeAuditOrders', count: 0 },
+        { key: 'allocationPending', url: '/pages/admin/allocationStorehouseAuditOrders', count: 0 },
+        { key: 'itemReleasePending', url: '/pages/property/itemReleaseUndo', count: 0 },
+        { key: 'visitPending', url: '/pages/property/visitUndo', count: 0 }
       ],
       completedItems: [
-        { key: 'repairCompleted', url: '/#/pages/property/myRepairDispatchManage' },
-        { key: 'complaintCompleted', url: '/#/pages/complaint/doHistoryComplaints' },
-        { key: 'purchaseCompleted', url: '/#/pages/admin/myAuditHistoryOrders' },
-        { key: 'collectionCompleted', url: '/#/pages/admin/myItemOutAuditHistoryOrders' },
-        { key: 'contractApplyCompleted', url: '/#/pages/admin/contractApplyAuditHistoryOrders' },
-        { key: 'contractChangeCompleted', url: '/#/pages/admin/contractChangeAuditHistoryOrders' },
-        { key: 'allocationCompleted', url: '/#/pages/admin/allocationStorehouseHistoryAuditOrders' },
-        { key: 'itemReleaseCompleted', url: '/#/pages/property/itemReleaseFinish' },
-        { key: 'visitCompleted', url: '/#/pages/property/visitFinish' }
+        { key: 'repairCompleted', url: '/pages/property/myRepairDispatchManage' },
+        { key: 'complaintCompleted', url: '/pages/complaint/doHistoryComplaints' },
+        { key: 'purchaseCompleted', url: '/pages/admin/myAuditHistoryOrders' },
+        { key: 'collectionCompleted', url: '/pages/admin/myItemOutAuditHistoryOrders' },
+        { key: 'contractApplyCompleted', url: '/pages/admin/contractApplyAuditHistoryOrders' },
+        { key: 'contractChangeCompleted', url: '/pages/admin/contractChangeAuditHistoryOrders' },
+        { key: 'allocationCompleted', url: '/pages/admin/allocationStorehouseHistoryAuditOrders' },
+        { key: 'itemReleaseCompleted', url: '/pages/property/itemReleaseFinish' },
+        { key: 'visitCompleted', url: '/pages/property/visitFinish' }
       ],
       communityId: ''
     }
@@ -4,50 +4,97 @@
       <div slot="header" class="flex justify-between">
         <span>{{ $t('newOaWorkflowFormEdit.title') }}</span>
       </div>
-      <el-form>
+      <el-form ref="form" :model="formData" class="text-left" label-width="120px">
         <el-row :gutter="20">
           <el-col :span="24">
             <div v-for="(item, index) in newOaWorkflowFormEditInfo.components" :key="index">
+              <!-- 文本框 -->
               <el-form-item v-if="item.type === 'textfield'" :label="item.label"
-                :prop="'components.' + index + '.value'"
-                :rules="[{ required: item.validate && item.validate.required, message: $t('newOaWorkflowFormEdit.requiredMessage') }]">
-                <el-input v-model="item.value" :placeholder="item.description" clearable />
+                :prop="item.key"
+                :rules="getValidationRules(item)">
+                <el-input v-model="formData[item.key]" :placeholder="item.description" clearable />
               </el-form-item>
-              <el-form-item v-if="item.type === 'number'" :label="item.label" :prop="'components.' + index + '.value'">
-                <el-input-number v-model="item.value" :placeholder="item.description" controls-position="right" />
+              <!-- 数字框 -->
+              <el-form-item v-if="item.type === 'number'" :label="item.label" 
+                :prop="item.key"
+                :rules="getValidationRules(item)">
+                <el-input-number v-model="formData[item.key]" :placeholder="item.description" 
+                  controls-position="right" style="width: 100%" />
               </el-form-item>
+              <!-- 文本域 -->
               <el-form-item v-if="item.type === 'textarea'" :label="item.label"
-                :prop="'components.' + index + '.value'">
-                <el-input v-model="item.value" type="textarea" :placeholder="item.description" :rows="4" />
+                :prop="item.key"
+                :rules="getValidationRules(item)">
+                <el-input v-model="formData[item.key]" type="textarea" :placeholder="item.description" 
+                  :rows="4" />
               </el-form-item>
+              <!-- 日期选择 -->
               <el-form-item v-if="item.type === 'textdate'" :label="item.label"
-                :prop="'components.' + index + '.value'">
-                <el-date-picker v-model="item.value" type="date" :placeholder="item.description"
-                  value-format="yyyy-MM-dd" />
+                :prop="item.key"
+                :rules="getValidationRules(item)">
+                <el-date-picker v-model="formData[item.key]" type="date" :placeholder="item.description"
+                  value-format="yyyy-MM-dd" style="width: 100%" />
               </el-form-item>
+              <!-- 日期时间选择 -->
               <el-form-item v-if="item.type === 'textdatetime'" :label="item.label"
-                :prop="'components.' + index + '.value'">
-                <el-date-picker v-model="item.value" type="datetime" :placeholder="item.description"
-                  value-format="yyyy-MM-dd HH:mm:ss" />
+                :prop="item.key"
+                :rules="getValidationRules(item)">
+                <el-date-picker v-model="formData[item.key]" type="datetime" :placeholder="item.description"
+                  value-format="yyyy-MM-dd HH:mm:ss" style="width: 100%" />
               </el-form-item>
+              <!-- 单选框 -->
+              <el-form-item v-if="item.type === 'radio'" :label="item.label"
+                :prop="item.key"
+                :rules="getValidationRules(item)">
+                <el-radio-group v-model="formData[item.key]">
+                  <el-radio v-for="(option, optionIndex) in item.values" :key="optionIndex"
+                    :label="option.value">
+                    {{ option.label }}
+                  </el-radio>
+                </el-radio-group>
+              </el-form-item>
+
+              <!-- 下拉选择 -->
+              <el-form-item v-if="item.type === 'select'" :label="item.label"
+                :prop="item.key"
+                :rules="getValidationRules(item)">
+                <el-select v-model="formData[item.key]" :placeholder="item.description" 
+                  style="width: 100%" clearable>
+                  <el-option v-for="(option, optionIndex) in item.values" :key="optionIndex"
+                    :label="option.label" :value="option.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+
+              <!-- 复选框 - 修复数组类型问题 -->
               <el-form-item v-if="item.type === 'checkbox'" :label="item.label"
-                :prop="'components.' + index + '.value'">
-                <el-checkbox-group v-model="item.value">
-                  <el-checkbox :label="item.value">{{ item.label }}</el-checkbox>
+                :prop="item.key"
+                :rules="getValidationRules(item)">
+                <el-checkbox-group v-model="formData[item.key]">
+                  <el-checkbox v-for="(option, optionIndex) in item.values" :key="optionIndex"
+                    :label="option.value">
+                    {{ option.label }}
+                  </el-checkbox>
                 </el-checkbox-group>
               </el-form-item>
             </div>
-            <upload-file ref="uploadFile" :call-back-listener="'newOaWorkflowFormEdit'"
-              :call-back-function="'fileName'" />
+            <!-- 文件上传 -->
+            <el-form-item :label="$t('common.file')">
+              <div class="file-info" v-if="newOaWorkflowFormEditInfo.fileName">
+                <el-tag type="info">{{ newOaWorkflowFormEditInfo.fileName }}</el-tag>
+              </div>
+              <upload-file ref="uploadFile" @notify="handleFileUpload" />
+            </el-form-item>
+            <!-- 按钮区域 -->
             <div class="form-footer">
-              <el-button type="primary" @click="_submitFormData">
+              <el-button type="primary" @click="_submitFormData" :loading="submitLoading">
                 <i class="el-icon-check"></i>
                 {{ $t('newOaWorkflowFormEdit.submit') }}
               </el-button>
@@ -64,7 +111,7 @@
 <script>
 import { queryOaWorkflowForm, queryOaWorkflowFormData, updateOaWorkflowFormData } from '@/api/oa/newOaWorkflowFormEditApi'
-import UploadFile from '@/components/oa/uploadFile'
+import UploadFile from '@/components/upload/uploadFile'
 export default {
   name: 'NewOaWorkflowFormEditList',
@@ -81,7 +128,9 @@ export default {
         id: '',
         fileName: '',
         realFileName: ''
-      }
+      },
+      formData: {}, // 新增：用于表单数据绑定
+      submitLoading: false
     }
   },
   created() {
@@ -102,11 +151,34 @@ export default {
         const formData = JSON.parse(data[0].formJson)
         this.newOaWorkflowFormEditInfo.formJson = formData
         this.newOaWorkflowFormEditInfo.components = formData.components
+        
+        // 初始化表单数据
+        this.initFormData()
+        
         this._listOaWorkflowDetails()
       } catch (error) {
         console.error('获取表单数据失败:', error)
+        this.$message.error('获取表单数据失败')
       }
     },
+
+    initFormData() {
+      // 初始化表单数据对象
+      this.formData = {}
+      this.newOaWorkflowFormEditInfo.components.forEach(item => {
+        if (item.type !== 'button' && item.type !== 'text') {
+          if (item.type === 'checkbox') {
+            // 确保复选框的值是数组类型
+            this.$set(this.formData, item.key, [])
+          } else if (item.type === 'radio' || item.type === 'select') {
+            this.$set(this.formData, item.key, item.values && item.values.length > 0 ? item.values[0].value : '')
+          } else {
+            this.$set(this.formData, item.key, '')
+          }
+        }
+      })
+    },
+
     async _listOaWorkflowDetails() {
       try {
         const params = {
@@ -119,39 +191,80 @@ export default {
         const { data } = await queryOaWorkflowFormData(params)
         const detailData = data[0]
+        // 更新表单数据
         this.newOaWorkflowFormEditInfo.components.forEach(item => {
-          item.value = detailData[item.key]
+          if (item.type !== 'button' && item.type !== 'text') {
+            const value = detailData[item.key]
+            if (value !== undefined && value !== null) {
+              if (item.type === 'checkbox') {
+                // 确保复选框数据是数组类型
+                if (Array.isArray(value)) {
+                  this.$set(this.formData, item.key, value)
+                } else if (typeof value === 'string' && value) {
+                  // 如果是字符串，转换为数组
+                  this.$set(this.formData, item.key, [value])
+                } else {
+                  this.$set(this.formData, item.key, [])
+                }
+              } else {
+                this.$set(this.formData, item.key, value)
+              }
+            }
+          }
         })
-        if (detailData.files) {
+        // 处理文件数据
+        if (detailData.files && detailData.files.length > 0) {
           this.newOaWorkflowFormEditInfo.fileName = detailData.files[0].fileName
           this.newOaWorkflowFormEditInfo.realFileName = detailData.files[0].realFileName
-          this.$refs.uploadFile.notifyVedio(detailData.files[0].fileName)
+          this.$nextTick(() => {
+            if (this.$refs.uploadFile) {
+              this.$refs.uploadFile.notifyVedio(detailData.files[0].fileName)
+            }
+          })
         }
       } catch (error) {
         console.error('获取表单详情失败:', error)
+        this.$message.error('获取表单详情失败')
       }
     },
+
+    getValidationRules(item) {
+      const rules = []
+      if (item.validate && item.validate.required) {
+        rules.push({
+          required: true,
+          message: `${item.label}不能为空`,
+          trigger: 'blur'
+        })
+      }
+      return rules
+    },
+
     async _submitFormData() {
       try {
-        const components = this.newOaWorkflowFormEditInfo.components
+        // 表单验证
+        await this.$refs.form.validate()
+        
+        this.submitLoading = true
+        
         const formData = {
           id: this.newOaWorkflowFormEditInfo.id,
           flowId: this.newOaWorkflowFormEditInfo.flowId,
           fileName: this.newOaWorkflowFormEditInfo.fileName,
-          realFileName: this.newOaWorkflowFormEditInfo.realFileName
+          realFileName: this.newOaWorkflowFormEditInfo.realFileName,
+          
         }
-        components.forEach(item => {
-          if (item.validate && item.validate.required && !item.value) {
-            this.$message.error(item.label + this.$t('newOaWorkflowFormEdit.requiredMessage'))
-            throw new Error(item.label + this.$t('newOaWorkflowFormEdit.requiredMessage'))
-          }
-
+        // 收集表单数据
+        this.newOaWorkflowFormEditInfo.components.forEach(item => {
           if (item.type !== 'button' && item.type !== 'text') {
-            formData[item.key] = item.value
+            formData[item.key] = this.formData[item.key]
             if (item.type === 'checkbox') {
-              formData[item.key] = item.value.length > 0 ? item.value[0] : ''
+              // 复选框提交时取第一个值或空字符串
+              formData[item.key] = this.formData[item.key] && this.formData[item.key].length > 0 
+                ? this.formData[item.key][0] 
+                : ''
             }
           }
         })
@@ -161,15 +274,27 @@ export default {
           this.$message.success(this.$t('newOaWorkflowFormEdit.submitSuccess'))
           this.closeEditInfo()
         } else {
-          this.$message.error(res.msg)
+          this.$message.error(res.msg || this.$t('newOaWorkflowFormEdit.submitError'))
         }
       } catch (error) {
+        if (error.message) {
+          // 表单验证错误
+          return
+        }
         console.error('提交表单失败:', error)
         this.$message.error(this.$t('newOaWorkflowFormEdit.submitError'))
+      } finally {
+        this.submitLoading = false
       }
     },
+
     closeEditInfo() {
       this.$router.go(-1)
+    },
+
+    handleFileUpload(data) {
+      this.newOaWorkflowFormEditInfo.fileName = data.fileName
+      this.newOaWorkflowFormEditInfo.realFileName = data.realFileName
     }
   }
 }
@@ -191,5 +316,9 @@ export default {
   .el-form-item {
     margin-bottom: 22px;
   }
+
+  .file-info {
+    margin-bottom: 10px;
+  }
 }
 </style>
 \ No newline at end of file
@@ -23,7 +23,7 @@
       <el-col :span="20">
         <div class="content-wrapper">
           <new-oa-workflow-pool v-show="activeTab === 'newOaWorkflowPool'" ref="newOaWorkflowPool" />
-          <new-oa-workflow-form v-if="activeTab === 'newOaWorkflowForm'" ref="newOaWorkflowForm" />
+          <new-oa-workflow-form v-if="activeTab === 'newOaWorkflowForm'" ref="newOaWorkflowForm"  @switch-tab="switchTab"/>
           <new-oa-workflow-undo v-show="activeTab === 'newOaWorkflowUndo'" ref="newOaWorkflowUndo" />
           <new-oa-workflow-finish v-show="activeTab === 'newOaWorkflowFinish'" ref="newOaWorkflowFinish" />
         </div>
 <template>
   <div class="start-work-container">
     <el-row :gutter="20">
-      <el-col :span="2">
+      <el-col :span="3">
         <div class="state-sidebar">
           <ul class="state-list">
             <li v-for="(item, index) in states" :key="index" class="state-item"
@@ -11,12 +11,12 @@
           </ul>
         </div>
       </el-col>
-      <el-col :span="22">
+      <el-col :span="21">
         <el-card class="search-card">
           <div slot="header" class="flex justify-between">
             <span>{{ $t('startWork.search.title') }}</span>
           </div>
-          <el-form :inline="true" :model="conditions" class="search-form">
+          <el-form :inline="true" :model="conditions" class="search-form text-left">
             <el-form-item>
               <el-input v-model="conditions.workName" :placeholder="$t('startWork.search.workName')" clearable />
             </el-form-item>
@@ -9,7 +9,7 @@
         <el-col :span="6">
           <el-input v-model.trim="searchForm.typeName" :placeholder="$t('workType.search.typeName')" clearable />
         </el-col>
-        <el-col :span="18" style="margin-top:5px;">
+        <el-col :span="6" >
           <el-button type="primary" @click="handleSearch">
             <i class="el-icon-search"></i>
             {{ $t('common.search') }}
@@ -122,7 +122,7 @@ export default {
       this.$refs.deleteOrgRelStaff.open(staff);
     },
     toStaffDetail(staff) {
-      this.$router.push(`/views/staff/staffDetailList?staffId=${staff.userId}`)
+      this.$router.push(`/views/staff/staffDetail?staffId=${staff.userId}`)
     },
     handlePageChange(page) {
@@ -69,35 +69,43 @@
             <table class="custom-table">
               <thead>
                 <tr>
-                  <th style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
+                  <th
+                    style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
                     {{ $t('addItemOut.itemType') }}
                   </th>
-                  <th style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
+                  <th
+                    style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
                     {{ $t('addItemOut.itemName') }}
                   </th>
-                  <th style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
+                  <th
+                    style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
                     {{ $t('addItemOut.itemSpec') }}
                   </th>
-                  <th style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
+                  <th
+                    style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
                     {{ $t('addItemOut.price') }}
                   </th>
-                  <th style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
+                  <th
+                    style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
                     {{ $t('addItemOut.stock') }}
                   </th>
-                  <th style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
+                  <th
+                    style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
                     {{ $t('addItemOut.applyQuantity') }}
                   </th>
-                  <th style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
+                  <th
+                    style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
                     {{ $t('addItemOut.remark') }}
                   </th>
-                  <th style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
+                  <th
+                    style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5; background-color: #fafafa;">
                     {{ $t('addItemOut.operation') }}
                   </th>
                 </tr>
               </thead>
               <tbody>
-                <tr v-for="(item, index) in addItemOutInfo.resourceStores" :key="index" 
-                    style="border-bottom: 1px solid #ebeef5;">
+                <tr v-for="(item, index) in addItemOutInfo.resourceStores" :key="index"
+                  style="border-bottom: 1px solid #ebeef5;">
                   <td style="text-align: center; padding: 12px 8px; border: 1px solid #ebeef5;">
                     {{ item.parentRstName || '-' }} > {{ item.rstName || '-' }}
                   </td>
@@ -159,8 +167,8 @@
               <el-form-item :label="$t('addItemOut.approver')">
                 <el-row :gutter="20">
                   <el-col :span="18">
-                    <el-input :placeholder="$t('addItemOut.approverPlaceholder')" v-model="addItemOutInfo.audit.staffName"
-                      disabled></el-input>
+                    <el-input :placeholder="$t('addItemOut.approverPlaceholder')"
+                      v-model="addItemOutInfo.audit.staffName" disabled></el-input>
                   </el-col>
                   <el-col :span="6">
                     <el-button type="primary" @click="chooseStaff">
@@ -230,7 +230,7 @@ export default {
             this.resetPwdVisible = true
         },
         openStaffDetail(staff) {
-            this.$router.push(`/views/staff/staffDetailList?staffId=${staff.userId}`)
+            this.$router.push(`/views/staff/staffDetail?staffId=${staff.userId}`)
         },
         handleSuccess() {
             this.loadData(this.page.current, this.page.size)