吉安感知网项目-前端
shuishen
2026-02-03 89380e6260a75d1d3b94de687ebcc2f50d50659d
applications/task-work-order/src/views/orderView/flyingHand/FlyingHandDialog.vue
@@ -7,21 +7,72 @@
      destroy-on-close
      :close-on-click-modal="false"
   >
   <el-row class="detail-row-view" v-if="dialogType === 'view'">
      <el-col :span="12">
        <div class="label">飞手姓名</div>
        <div class="val">{{ formData.flyerName }}</div>
      </el-col>
      <el-col :span="12">
        <div class="label">飞手电话</div>
        <div class="val">{{ formData.flyerPhone }}</div>
      </el-col>
      <el-col :span="12">
        <div class="label">飞行时长</div>
        <div class="val">{{ formData.flightHours }}</div>
      </el-col>
      <el-col :span="12">
        <div class="label">技术特长</div>
        <div class="val">{{ getDictLabel(formData.technicalStrength, dictObj.technicalStrength) }}</div>
      </el-col>
     <el-col :span="12">
        <div class="label">擅长机型</div>
        <div class="val">{{ getDictLabel(formData.skilledUavType, dictObj.skilledUavType) }}</div>
      </el-col>
     <el-col :span="12">
        <div class="label">擅长任务类型</div>
        <div class="val">{{ getDictLabel(formData.skilledTaskType, dictObj.workOrderType) }}</div>
      </el-col>
     <el-col :span="12">
        <div class="label">项目经验</div>
        <div class="val">{{ formData.projectExperience }}</div>
      </el-col>
     <el-col :span="12">
        <div class="label">飞手地址</div>
        <div class="val">{{ formData.flyerAddress }}</div>
      </el-col>
     <el-col :span="24">
        <div class="label">飞手证书</div>
        <div class="val">
         <el-image
            v-for="(item, index) in formData.certification"
            :key="index"
            :src="item"
            :preview-src-list="formData.certification"
            class="gd-image"
            style="width: 100px; height: 100px; margin-right: 10px;"
         />
      </div>
      </el-col>
    </el-row>
      <el-form
         ref="formRef"
         :model="formData"
         :rules="rules"
         class="gd-form"
         class="gd-dialog-form"
         label-width="160px"
         v-else
      >
         <el-row>
            <el-col :span="12">
               <el-form-item label="飞手姓名" prop="flyerName">
               <el-form-item label="飞手姓名" prop="flyerId">
                  <el-select
                     class="gd-select"
                     popper-class="gd-select-popper"
                     v-model="formData.flyerName"
                     placeholder="请选择飞手姓名"
                     v-model="formData.flyerId"
                     placeholder="请选择"
                     clearable
                     @change="handleChange"
                     :disabled="dialogType === 'view'"
                  >
                     <el-option
@@ -38,7 +89,7 @@
                  <el-input
                  class="gd-input"
                     v-model="formData.flyerPhone"
                     placeholder="请输入飞手电话"
                     placeholder="请输入"
                     :disabled="dialogType === 'view'"
                  />
               </el-form-item>
@@ -48,7 +99,7 @@
                  <el-input
                     class="gd-input"
                     v-model.number="formData.flightHours"
                     placeholder="请输入飞行时长"
                     placeholder="请输入"
                     type="number"
                     :disabled="dialogType === 'view'"
                  />
@@ -60,7 +111,7 @@
                     class="gd-select"
                     popper-class="gd-select-popper"
                     v-model="formData.technicalStrength"
                     placeholder="请选择技术特长"
                     placeholder="请选择"
                     :disabled="dialogType === 'view'"
                  >
                     <el-option
@@ -78,7 +129,8 @@
                     class="gd-select"
                     popper-class="gd-select-popper"
                     v-model="formData.skilledUavType"
                     placeholder="请选择擅长机型"
                     placeholder="请选择"
                     :disabled="dialogType === 'view'"
                     clearable
                     @change="handleSearch"
                  >
@@ -97,11 +149,11 @@
                     class="gd-select"
                     popper-class="gd-select-popper"
                     v-model="formData.skilledTaskType"
                     placeholder="请选择擅长任务类型"
                     placeholder="请选择"
                     :disabled="dialogType === 'view'"
                  >
                     <el-option
                        v-for="item in dictObj.skilledTaskType"
                        v-for="item in dictObj.workOrderType"
                        :key="item.dictKey"
                        :label="item.dictValue"
                        :value="item.dictKey"
@@ -114,7 +166,7 @@
                  <el-input
                     class="gd-input"
                     v-model="formData.projectExperience"
                     placeholder="请输入项目经验"
                     placeholder="请输入"
                     type="textarea"
                     rows="3"
                     :disabled="dialogType === 'view'"
@@ -124,13 +176,14 @@
         </el-row>
      </el-form>
      <template #footer>
         <el-button @click="handleClose">取消</el-button>
         <el-button v-if="dialogType !== 'view'" color="#F2F3F5" @click="handleClose">取消</el-button>
         <el-button
            v-if="dialogType !== 'view'"
            type="primary"
            color="#4C34FF"
            @click="handleSubmit"
         >
            确定
            保存
         </el-button>
      </template>
   </el-dialog>
@@ -139,6 +192,9 @@
import { ref, reactive, computed, watch, inject } from 'vue'
import { submitFlyingHand } from './flyingHandApi'
import { ElMessage } from 'element-plus'
import { getDictLabel } from '@ztzf/utils'
import { fieldRules } from '@ztzf/utils'
const props = defineProps({
   modelValue: {
@@ -170,46 +226,70 @@
const dialogTitle = computed(() => {
   switch (props.dialogType) {
      case 'add':
         return '添加飞手信息'
         return '飞手建档'
      case 'edit':
         return '编辑飞手信息'
         return '编辑'
      case 'view':
         return '查看飞手信息'
         return '查看'
      default:
         return '飞手信息'
   }
})
const formRef = ref(null)
const formData = reactive({
const initForm = () => ({
   flyerName: '',
   flyerId: '',
   flyerPhone: '',
   flightHours: 0,
   projectExperience: '',
   technicalStrength: '',
   skilledUavType: ''
   skilledUavType: '',
   certification: [], // 证书
   regionCode: '', // 区域编码
})
const formData = ref(initForm()) // 表单数据
// const rules = {
//    flyerId: fieldRules(true),
//    flyerPhone: fieldRules(true, 50),
//    flightHours: fieldRules(true, 50),
//    technicalSkills: fieldRules(true, 50),
//    skilledTaskType: fieldRules(true),
//    projectExperience: fieldRules(true),
//    technicalStrength: fieldRules(true),
//    skilledUavType: fieldRules(true, 50),
// }
const rules = {
   flyerName: [
      { required: true, message: '请输入飞手姓名', trigger: 'blur' }
   flyerId: [
      { required: true, message: '请输入', trigger: 'blur' }
   ],
   flyerPhone: [
      { required: false, message: '请输入飞手电话', trigger: 'blur' },
      { required: false, message: '请输入', trigger: 'blur' },
      { pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' }
   ],
   flightHours: [
      { required: true, message: '请输入飞行时长', trigger: 'blur' },
      { required: true, message: '请输入', trigger: 'blur' },
      { type: 'number', min: 0, message: '飞行时长必须大于等于0', trigger: 'blur' }
   ],
   technicalSkills: [
      { required: true, message: '请选择技术特长', trigger: 'change' }
      { required: true, message: '请选择', trigger: 'change' }
   ],
   skilledTaskType: [
      { required: true, message: '请选择擅长任务类型', trigger: 'change' }
      { required: true, message: '请选择', trigger: 'change' }
   ],
   projectExperience: [
      { required: true, message: '请输入项目经验', trigger: 'blur' }
      { required: true, message: '请输入', trigger: 'blur' }
   ],
   technicalStrength: [
      { required: true, message: '请选择', trigger: 'change' }
   ],
   skilledUavType: [
      { required: true, message: '请选择', trigger: 'change' }
   ]
}
@@ -217,8 +297,10 @@
watch(
   () => props.flyingHandData,
   (newData) => {
      formData.value = initForm()
      if (newData) {
         Object.assign(formData, newData)
         Object.assign(formData.value, newData)
         formData.value.flightHours = Number(newData.flightHours)
      }
   },
   { deep: true, immediate: true }
@@ -230,19 +312,28 @@
   resetForm()
}
// 处理选择飞手姓名
function handleChange(val) {
   const result = flyingHandList.value.find(item => item.id === val) || []
   formData.value.flyerName = result.name
   formData.value.regionCode = result.regionCode
   formData.value.certification = formData.value.certification.concat(result.licenseFrontFileUrl || [], result.licenseBackFileUrl || [])
}
// 重置表单
function resetForm() {
   formRef.value?.resetFields()
   // 重置为默认值
   Object.assign(formData, {
      name: '',
      phone: '',
   Object.assign(formData.value, {
      flyerName: '',
      flyerPhone: '',
      flightHours: 0,
      projectExperience: '',
      technicalSkills: '',
      technicalExpertise: '',
      goodAtAircraftType: '',
      goodAtTaskType: ''
      technicalStrength: '',
      skilledUavType: '',
      skilledTaskType: ''
   })
}
@@ -255,10 +346,10 @@
   try {
      if (props.dialogType === 'add') {
         await submitFlyingHand(formData)
         await submitFlyingHand(formData.value)
         ElMessage.success('添加成功')
      } else if (props.dialogType === 'edit') {
         await submitFlyingHand(formData)
         await submitFlyingHand(formData.value)
         ElMessage.success('编辑成功')
      }
      emit('confirm')
@@ -275,4 +366,4 @@
      margin-bottom: 20px;
   }
}
</style>
</style>